用户点击input的时候;

会默认调出手机软键盘;

场景:文本框获取焦点时,需要禁止手机弹出自带的输入键盘;

解决方案1

用一个p/div等标签显示内容;然后放一个隐藏的input;

(可能的场景:当扫描二维码或者别的操作时候,JS赋值隐藏的input值和显示的文本;)

(可能的场景:当用户点击输入框,调出自定义的日期软键盘或者数字输入键;阻止自带输入键盘的弹出)

这种解决方案,因为当用户点击的时候,因为点击的是p之类的标签,所以也不会弹出;

解决方案2

  1. $form.on("focus","input[name=qrCode]",function(){
  2. document.activeElement.blur();//屏蔽默认键盘弹出;
  3. });

这段代码就是点击的时候,屏蔽默认的键盘呼出;iPhone和安卓手机测试可以;

~~~

HTML5页面,用JS 禁止弹出手机键盘的更多相关文章

  1. 【Android】页面迁移时先弹出键盘问题解决

    android自动弹出软键盘(输入键盘) 在AndroidMainfest.xml内容无法更改情况下,也就是键盘非要弹出情况下,进入此页面时先关闭软键盘不让其弹出 InputMethodManager ...

  2. JS弹出层制作,以及移动端禁止弹出层下内容滚动,overflow:hidden移动端失效问题

    HTML <div class="layer"> <div class="menu-list"> <span>社会</ ...

  3. SilverLight 页面后台方法XX.xaml.cs 创建JS,调用JS ,弹出提示框

    1.Invoke和InvokeSelf [c-sharp] view plaincopy public partial class CreateJSDemo : UserControl { publi ...

  4. Android进入一个新页面,EditText失去焦点并禁止弹出键盘

    android在进入一个新页面后,edittext会自动获取焦点并弹出软键盘,这样并不符合用户操作习惯. 在其父控件下,添加如下的属性,就可以完美解决,使其进入页面后不主动获取焦点,并且不弹出软键盘: ...

  5. 手机浏览器浏览WebApp弹出的键盘遮盖住文本框的解决办法

    手机浏览器浏览WebApp弹出的键盘遮盖住文本框的解决办法 最近碰到Android微信内置浏览H5页面,因为其中的文本输入框(input)放置在靠近页面的中下方,点击文本框以后,则输入框会被弹出的手机 ...

  6. 微信内置浏览器浏览H5页面弹出的键盘遮盖文本框的解决办法(转)

    最近在做微信公众号的内嵌页面,发现点击输入框时键盘盖住文本框,找到一段代码解决了这个问题. iOS和android手机都已亲测,需要的可以直接拷贝到代码中使用. js代码如下: $(function ...

  7. js简单弹出层、遮罩层

    <html> <head> <title>js简单弹出层</title> <style> /*阴影边框效果*/ .box-shadow-1 ...

  8. JS设置弹出小窗口。

    经常上网的朋友可能会到过这样一些网站,一进入首页立刻会弹出一个窗口,或者按一个连接或按钮弹出,通常在这个窗口里会显示一些注意事项.版权信息.警告.欢迎光顾之类的话或者作者想要特别提示的信息.其实制作这 ...

  9. [转]js来弹出窗口的详细说明

    1.警告对话框 <script> alert("警告文字") </script> 2.确认对话框 <script> confirm(" ...

随机推荐

  1. HDU 1532 Drainage Ditches(网络流模板题)

    题目大意:就是由于下大雨的时候约翰的农场就会被雨水给淹没,无奈下约翰不得不修建水沟,而且是网络水沟,并且聪明的约翰还控制了水的流速, 本题就是让你求出最大流速,无疑要运用到求最大流了.题中m为水沟数, ...

  2. yii2使用 db log

    在本地测试的时候,输出log,还是输出到db中比较顺手. 配置过程: 1.加入log组件的配置: 'log' =>[ # 追踪级别 # 消息跟踪级别 # 在开发的时候,通常希望看到每个日志消息来 ...

  3. Docker+.Net Core 的那些事儿-2.创建Docker镜像

    1.从store.docker.com获取.net core镜像 docker pull microsoft/dotnet 2.创建一个.net core项目,并发布 在上篇文章结尾建立的工作目录下, ...

  4. Minor GC和Full GC区别(转)

    http://blog.csdn.net/u010796790/article/details/52213708   概念: 新生代 GC(Minor GC):指发生在新生代的垃圾收集动作,因为 Ja ...

  5. 设置oracle编辑的快捷方式

    打开PLSQL Developer: 中文版:[工具]-->[首选项]-->[用户界面]-->[编辑器],在右侧界面往下拉找到[自动替换],点击[编辑],就可以自定义想要的快捷方式了 ...

  6. 2017阿里C++研发工程师-校招-笔试模拟

    题目描述: 猎人把一对兔子婴儿(一公一母称为一对)放到一个荒岛上,两年之后,它们生00下一对小兔,之后开始每年都会生下一对小兔.生下的小兔又会以同样的方式继续繁殖. 兔子的寿命都是x(x>=3) ...

  7. kafka运行错误:提示找不到或者无法加载主类错误解决方法

    kafaka版本:kafka_2.11-1.1.0原因有2个:1  目录不能有空格   D:\Soft\kafka_2.11-1.1.0 , 放在Program Files目录中一直有问题2  修改D ...

  8. openwrt中的append-ubi定义在哪里

    include/image-commands.mk 定义如下: define Build/append-ubi sh $(TOPDIR)/scripts/ubinize-image.sh \ $(if ...

  9. Linux禁止普通用户使用crontab命令

    cron计划任务默认root用户与非root用户都可以执行,当然如果在安全方面想禁用这部分用户,则可以通过两个文件来解决: cron.allow cron.deny cron.allow:定义允许使用 ...

  10. angularjs 整合bootstrap 时间控件

    一.引入js <link href="${basePath}/static/plugin/bootstrap/css/bootstrap-datetimepicker.min.css& ...