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 css的使用介绍
Apr 18 Javascript
javascript的渐进增强与平稳退化浅谈
Nov 12 Javascript
js实现多选项切换导航菜单的方法
Feb 06 Javascript
JavaScript 对象深入学习总结(经典)
Sep 29 Javascript
JavaScript使用DeviceOne开发实战(四)仿优酷视频应用
Dec 02 Javascript
vue登录注册及token验证实现代码
Dec 14 Javascript
微信小程序动态生成二维码的实现代码
Jul 25 Javascript
JS+php后台实现文件上传功能详解
Mar 02 Javascript
Node.js使用supervisor进行开发中调试的方法
Mar 26 Javascript
layui 监听select选择 获取当前select的ID名称方法
Sep 24 Javascript
JavaScript设计模式--简单工厂模式实例分析【XHR工厂案例】
May 23 Javascript
解决echarts echarts数据动态更新和dataZoom被重置问题
Jul 20 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导出MySQL数据到Excel文件(fputcsv)
2011/07/03 PHP
php使用GD实现颜色渐变实例
2015/06/02 PHP
PHP生成制作验证码的简单实例
2016/06/12 PHP
node.js中的buffer.write方法使用说明
2014/12/10 Javascript
使用Chrome浏览器调试AngularJS应用的方法
2015/06/18 Javascript
JS实现点击上移下移LI行数据的方法
2015/08/05 Javascript
window.open不被拦截的简单实现代码(推荐)
2016/08/04 Javascript
AngularJS ng-repeat数组有重复值的解决方法
2016/10/23 Javascript
html5+CSS 实现禁止IOS长按复制粘贴功能
2016/12/28 Javascript
微信小程序  http请求封装详解及实例代码
2017/02/15 Javascript
vue-cli+webpack记事本项目创建
2017/04/01 Javascript
jQuery实现可拖动进度条实例代码
2017/06/21 jQuery
Vue项目使用CDN优化首屏加载问题
2018/04/01 Javascript
微信小程序websocket实现聊天功能
2020/03/30 Javascript
JS加密插件CryptoJS实现的Base64加密示例
2020/08/16 Javascript
微信小程序实现禁止分享代码实例
2019/10/19 Javascript
Windows8下安装Python的BeautifulSoup
2015/01/22 Python
Python的Flask框架中Flask-Admin库的简单入门指引
2015/04/07 Python
在Python的Django框架中生成CSV文件的方法
2015/07/22 Python
python对配置文件.ini进行增删改查操作的方法示例
2017/07/28 Python
pandas DataFrame数据转为list的方法
2018/04/11 Python
python 3.7.0 下pillow安装方法
2018/08/27 Python
django的settings中设置中文支持的实现
2019/04/28 Python
使用浏览器访问python写的服务器程序
2019/10/10 Python
安装python3.7编译器后如何正确安装opnecv的方法详解
2020/06/16 Python
Python用dilb提取照片上人脸的示例
2020/10/26 Python
CSS Grid布局教程之什么是网格布局
2014/12/30 HTML / CSS
宝信软件JAVA工程师面试经历
2012/08/19 面试题
什么是聚集索引和非聚集索引
2012/01/17 面试题
大学校务公开实施方案
2014/03/31 职场文书
社会工作专业求职信
2014/07/15 职场文书
好的促销活动方案
2014/08/21 职场文书
2015年见习期工作总结
2014/12/12 职场文书
房产公证书
2015/01/23 职场文书
西安事变观后感
2015/06/12 职场文书
MySQL 存储过程的优缺点分析
2021/05/20 MySQL