移动端H5键盘(原创)

使用方法

必须引入的资源文件

 <!-- 核心样式【必须引入】 -->

<link rel="stylesheet" href="./css/mobile-keyboard.min.css">

<!-- 核心JS【必须引入】 -->

<script src="jquery/jquery-1.10.2.js"></script>

<script src="./js/mobile-keyboard.min.js"></script>

主题：带min的，是生产环境使用，因为压缩过，体积更小！

输入框初始化

<input type="text"  placeholder="纯数字类型" />

<input type="text"  placeholder="小数类型" />

<input type="text"  placeholder="身份证" />

<script>

    // 键盘初始化参数 type: {纯数字 = 0， 小数 = 1， 身份证 = 2}

    $('.num').bind("click", function(){

        $(this).mobileKeyboard({type: 0});

    });

 

    $('.float').bind("click", function(){

        $(this).mobileKeyboard({type: 1});

    });

 

    $('.idcard').bind("click", function(){

        $(this).mobileKeyboard({type: 2});

    });

</script>

开发该键盘的目的：移动端原生键盘，

①没有仅支持小数和数字的键盘；

②没有仅支持身份证使用的键盘，数字和字母x；所以开发这款键盘，支持原生webview内嵌h5使用。

该工具有什么特点：

①屏蔽了原生键盘；

②屏蔽了原生键盘后，模拟了原生输入框中的焦点，用户可以感知到当前输入框的状态。

愉快的使用吧~

搜索发现

下载榜观看榜