原因:
由于Android系统下,嵌入webview中H5页面调用系统键盘输入密码等敏感信息时会有安全隐患,所以目前很多公司都不会使用系统键盘,使用一套js写的模拟定制键盘,其中有全数字键盘,全键盘等
所以:
自己开发了一套模拟全键盘,ui模拟ios系统键盘风格,先上图片:
继续....
引入插件后会自动阻止默认系统键盘,使用模拟键盘。不依赖其他任何第三方库
测试通过机器:
iphone5~7,plus
华为,小米,三星等机型
使用方式:
<script>标签直接引用
// DOM 结构:
<input class="useKeyBorad"></input>
// js引入
<script type="text/javascript" src="keyboard.min.js"></script>
// 全局API
useKeyBoard() // 开启虚拟键盘
closeKeyBoard() // 关闭虚拟键盘
Vue等单页面模块引入:
// DOM 结构:
<input class="useKeyBorad"></input>
// 引入,注意js路径
import {useKeyBorad} from '../keyboard.min'
// 简单使用示例
export default {
data () {
return { }
},
mounted: function () {
useKeyBorad() // dom挂载完毕后直接使用
}
}