jQuery实现手机上输入后隐藏键盘功能


Posted in Javascript onJanuary 04, 2017

摘要: 例如,让用户输入手机发送验证码,输完11位手机号后,自动隐藏键盘

例如,让用户输入手机发送验证码,输完11位手机号后,自动隐藏键盘

表单大概这样的:

<div class="form-group">
  <input type="tel" class="form-control input-lg" id="mobile" name="mobile" placeholder="请输入手机号码">
</div>
<div class="form-group">
  <div class="input-group">
    <input type="tel" class="form-control input-lg verify-input" id="verify" name="verify" placeholder="请输入验证码" >
    <div class="input-group-btn">
      <span class="input-group-btn">
        <input value="获取" class="btn btn-info btn-lg verify-btn" id="get_verify" type="button">
      </span>
    </div>
  </div>
</div>

那么,jQuery大概是这样的:

$('#mobile').on('input',function(){
  var mobile = $(this).val();
  if(mobile.length == 11) {
    $('#get_verify').focus();
    return false;
  }
});

这是通过监听输入框里的值,如果是11位就把焦点移动“获取”这个按钮,从而实现键盘的隐藏!

ipone上测试可行!!!

引用路径:http://stackoverflow.com/questions/8780346/how-to-hide-keyboard-in-jquerymobile-page-in-a-phonegap-app

以上所述是小编给大家介绍的jQuery实现手机上输入后隐藏键盘功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
一个无限级XML绑定跨框架菜单(For IE)
Jan 27 Javascript
javascript setAttribute, getAttribute 在不同浏览器上的不同表现
Aug 05 Javascript
jquery事件重复绑定的快速解决方法
Jan 03 Javascript
node-http-proxy修改响应结果实例代码
Jun 06 Javascript
AngularJS实现一次监听多个值发生的变化
Aug 31 Javascript
AngularJS中controller控制器继承的使用方法
Nov 03 Javascript
详解使用vue-cli脚手架初始化Vue项目下的项目结构
Mar 08 Javascript
详解使用jQuery.i18n.properties实现js国际化
May 04 jQuery
用vscode开发vue应用的方法步骤
May 06 Javascript
layer.prompt输入层的例子
Sep 24 Javascript
jQuery实现消息弹出框效果
Dec 10 jQuery
linux服务器快速卸载安装node环境(简单上手)
Feb 22 Javascript
AngularJS控制器controller给模型数据赋初始值的方法
Jan 04 #Javascript
使用BootStrap实现表格隔行变色及hover变色并在需要时出现滚动条
Jan 04 #Javascript
微信小程序 石头剪刀布实例代码
Jan 04 #Javascript
使用JavaScript为一张图片设置备选路径的方法
Jan 04 #Javascript
微信小程序 Canvas增强组件实例详解及源码分享
Jan 04 #Javascript
AngularJS入门示例之Hello World详解
Jan 04 #Javascript
详解AngularJS验证、过滤器、指令
Jan 04 #Javascript
You might like
php实现zip压缩文件解压缩代码分享(简单易懂)
2014/05/10 PHP
php中使用sftp教程
2015/03/30 PHP
PHP+JS实现大规模数据提交的方法
2015/07/02 PHP
浅谈socket同步和异步、阻塞和非阻塞、I/O模型
2016/12/15 PHP
php格式文件打开的四种方法
2018/02/24 PHP
PHP PDOStatement::execute讲解
2019/01/31 PHP
基于Asp.net与Javascript控制的日期控件
2010/05/22 Javascript
JQuery Easyui Tree的oncheck事件实现代码
2010/05/28 Javascript
js前台分页显示后端JAVA数据响应
2013/03/18 Javascript
javascript中的onkeyup和onkeydown区别介绍
2013/04/28 Javascript
js中创建对象的几种方式示例介绍
2014/01/26 Javascript
Jquery获取和修改img的src值的方法
2014/02/17 Javascript
JS基于面向对象实现的放烟花效果
2015/05/07 Javascript
angularjs学习笔记之双向数据绑定
2015/09/26 Javascript
理解jquery事件冒泡
2016/01/03 Javascript
AngularJS实现单独作用域内的数据操作
2016/09/05 Javascript
基于js实现二级下拉联动
2016/12/17 Javascript
使用clipboard.js实现复制功能的示例代码
2017/10/16 Javascript
JS实现为动态创建的元素添加事件操作示例
2018/03/17 Javascript
解决cordova+vue 项目打包成APK应用遇到的问题
2019/05/10 Javascript
解决vue-cli输入命令vue ui没效果的问题
2020/11/17 Javascript
[05:13]TI4 中国战队 机场出征!!
2014/07/07 DOTA
[49:27]LGD vs OG 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
scrapy spider的几种爬取方式实例代码
2018/01/25 Python
Python爬虫实战:分析《战狼2》豆瓣影评
2018/03/26 Python
python自动截取需要区域,进行图像识别的方法
2018/05/17 Python
Java平台和其他软件平台有什么不同
2015/06/05 面试题
中专生自我鉴定范文
2014/02/02 职场文书
中专生自荐信
2014/06/25 职场文书
俞敏洪一分钟演讲稿
2014/08/26 职场文书
承诺书模板
2014/08/30 职场文书
党员弘扬焦裕禄精神思想汇报
2014/09/10 职场文书
小区保洁员岗位职责
2015/04/10 职场文书
教师节随笔
2015/08/15 职场文书
朋友圈早安励志语录!
2019/07/08 职场文书
Django使用echarts进行可视化展示的实践
2021/06/10 Python