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 相关文章推荐
JQuery验证jsp页面属性是否为空(实例代码)
Nov 08 Javascript
javascript实现淘宝幻灯片广告展示效果
Apr 27 Javascript
JS实现两表格里数据来回转移的方法
May 28 Javascript
Javascript实现鼠标右键特色菜单
Aug 04 Javascript
JS非Alert实现网页右下角“未读信息”效果弹窗
Sep 26 Javascript
jQuery实现带玻璃流光质感的手风琴特效
Nov 20 Javascript
浅析JavaScript声明变量
Dec 21 Javascript
JS实现兼容各种浏览器的高级拖动方法完整实例【测试可用】
Jun 21 Javascript
自动化测试读写64位操作系统的注册表
Aug 15 Javascript
详解vue项目接入微信JSSDK的坑
Dec 14 Javascript
微信小程序蓝牙连接小票打印机实例代码详解
Jun 03 Javascript
js实现简易ATM功能
Oct 27 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中__destruct与register_shutdown_function执行的先后顺序问题
2014/10/17 PHP
解决phpcms更换javascript的幻灯片代码调用图片问题
2014/12/26 PHP
php常用表单验证类用法实例
2015/06/18 PHP
PHP实现上传多文件示例代码
2017/02/20 PHP
JavaScript String.replace函数参数实例说明
2013/06/06 Javascript
javascript 获取iframe里页面中元素值的方法
2014/02/17 Javascript
教你如何使用node.js制作代理服务器
2014/11/26 Javascript
JQuery选择器、过滤器大整理
2015/05/26 Javascript
jquery实现点击展开列表同时隐藏其他列表
2015/08/10 Javascript
angularjs表格ng-table使用备忘录
2016/03/09 Javascript
js定义类的几种方法(推荐)
2016/06/08 Javascript
微信小程序开发之实现选项卡(窗口顶部TabBar)页面切换
2016/11/25 Javascript
Vue-resource实现ajax请求和跨域请求示例
2017/02/23 Javascript
jQuery Layer弹出层传值到父页面的实现代码
2017/08/17 jQuery
基于js原生和ajax的get和post方法以及jsonp的原生写法实例
2017/10/16 Javascript
vue 监听键盘回车事件详解 @keyup.enter || @keyup.enter.native
2018/08/25 Javascript
JavaScript原型对象原理与应用分析
2018/12/27 Javascript
新手快速上手webpack4打包工具的使用详解
2019/01/28 Javascript
如何使用Node.js爬取任意网页资源并输出PDF文件到本地
2019/06/17 Javascript
使用Python程序抓取新浪在国内的所有IP的教程
2015/05/04 Python
Python使用SocketServer模块编写基本服务器程序的教程
2016/07/12 Python
pycharm+PyQt5+python最新开发环境配置(踩坑)
2019/02/11 Python
python 五子棋如何获得鼠标点击坐标
2019/11/04 Python
Pytorch高阶OP操作where,gather原理
2020/04/30 Python
Python爬虫获取页面所有URL链接过程详解
2020/06/04 Python
Python Tkinter图形工具使用方法及实例解析
2020/06/15 Python
Python引入多个模块及包的概念过程解析
2020/09/21 Python
小白教你PyCharm从下载到安装再到科学使用PyCharm2020最新激活码
2020/09/25 Python
如何给HTML标签中的文本设置修饰线
2019/11/18 HTML / CSS
网上签名寄语活动留言
2014/01/18 职场文书
品质标语大全
2014/06/21 职场文书
大学生英文求职信范文
2015/03/19 职场文书
社区服务理念口号
2015/12/25 职场文书
初中英语教学反思范文
2016/02/15 职场文书
图文详解nginx日志切割的实现
2022/01/18 Servers
代码复现python目标检测yolo3详解预测
2022/05/06 Python