移动端经常项目中会有搜索之类的功能,一般实现的是按搜索按钮进行搜索,如果要像PC端一样实现按回车键进行搜索该怎么实现呢?

方法很简单,就是在搜索框的input外面套一个form标签  注意点:form标签一定得添加 action属性(可设置为空)

<form action=""><input type="text" name="search" /></form>

  移动端软键盘的回车会触发form的submit事件,所以我们只需要监听form的submit事件就可以实现按回车按钮进行搜索的功能

var oForm =  document.getElementsByTagName("form")[0];
oForm.onsubmit = function(){
$scope.searchOrder();
};

  题外话:我拿的ipad进行的测试 当input框外面套上form标签 并给form标签添加action属性后  软键盘上的return 会变成蓝色的Search.

JS移动端如何监听软键盘回车事件的更多相关文章

  1. js 移动端之监听软键盘弹出收起

    js 移动端关于页面布局,如果底部有position:fixed的盒子,又有input,当软键盘弹出收起都会影响页面布局.这时候Android可以监听resize事件,代码如下,而ios没有相关事件. ...

  2. h5 移动端 监听软键盘弹起、收起

    前面一篇博客 h5 安卓 键盘弹起界面适配 修改webview高度提到了在adnroid中如何监听软键盘的弹起与收起,是利用的窗口的高度发生变化window.onresize事件来做突破点的,但是io ...

  3. adnroid 监听软键盘的显隐

    首先注明出处,我只是想做个笔记:http://www.jb51.net/article/64820.htm 第一眼看到的时候,觉得不太可靠,因为之前都是看到这样处理的,根据监听一个根布局的size,可 ...

  4. Android 另类方法监听软键盘的弹出收起事件

    http://www.cnblogs.com/csonezp/p/5065624.html 最近做的项目碰到个问题,a界面是fragment+recyclerview,b界面带个edittext,并且 ...

  5. Android App监听软键盘按键的三种方式

    前言:   我们在android手机上面有时候会遇到监听手机软键盘按键的时候,例如:我们在浏览器输入url完毕后可以点击软键盘右下角的“GO”按键加载url页面:在点击搜索框的时候,点击右下角的sea ...

  6. 键盘-App监听软键盘按键的三种方式

    前言:   我们在android手机上面有时候会遇到监听手机软键盘按键的时候,例如:我们在浏览器输入url完毕后可以点击软键盘右下角的“GO”按键加载url页面:在点击搜索框的时候,点击右下角的sea ...

  7. Android App监听软键盘按键的三种方式(转)

    最近有类似需求,在csdn上刚好发现,粘贴过来,以防止忘记喽 前言:   我们在android手机上面有时候会遇到监听手机软键盘按键的时候,例如:我们在浏览器输入url完毕后可以点击软键盘右下角的“G ...

  8. ionic3 监听软键盘的高度

    ionic1 和普通cordova的大家都知道 就是看ionic3 和4 https://blog.csdn.net/sean_css/article/details/70243893 ionic c ...

  9. Android_靠谱的监听软键盘状态的方法

    public class MyActivity extends AppCompatActivity { /** * 当前界面中的软件盘的状态 */private boolean isKeyBoardO ...

随机推荐

  1. 必须掌握的八个cmd 命令

    一,ping 它是用来检查网络是否通畅或者网络连接速度的命令.作为一个生活在网络上的管理员或者黑客来说,ping命令是第一个必须掌握的DOS命令,它 所利用的原理是这样的:网络上的机器都有唯一确定的I ...

  2. EtherType

    EtherType is a two-octet field in an Ethernet frame. It is used to indicate which protocol is encaps ...

  3. RNN 入门学习资料整理

    建议按序阅读 1. RNN的一些简单概念介绍 A guide to recurrent neural networks and backpropagation Deep learning:四十九(RN ...

  4. 更新系统没有mac dashboard 问题解决

    今天更新了mac的系统到EL Capitan,结果出来以后发现平时经常使用的mac dashboard没了,就是这玩意: 找了半天方法,终于知道了这个叫“dashboard” (md之前完全不知道,无 ...

  5. setup notifier actions in aodh alarm

    Aodh alarm NOTIFIER ==> alarm_actions URL: http://<host>/<action> NOTIFIER will resol ...

  6. [翻译]Primer on Cognitive Computing(认知计算入门)

    Source Kelly J., Primer on Cognitive Computing 20150216. 侵删,联系方式:zhoujiagen\@gmail.com. 按A candidate ...

  7. JMS与MQ详解(有项目)

    <一>m2mGW项目 1.ActiveMQ概述     企业消息软件从80年代起就存在,它不只是一种应用间消息传递风格,也是一种集成风格.因此,消息传递可以满足应用间的通知和互相操作.但是 ...

  8. 移动web开发和移动app开发的区分

    1.移动web开发 这部分跟web前端开发差别不大,使用的技术都是html+css+js.区别为手机浏览器是webkit的天下,pc端是IE的天 下.手机网页可以理解成pc网页的缩小版加一些触摸特性. ...

  9. Github账户注册的过程

    首先我通过冯老师的博客园帖子中的链接进入了注册地址,填写了用户名,邮箱,和密码.然后我进入我的邮箱验证了Github网站给我发送的验证信息,至此,我的GITHUB账户便注册完成了.

  10. swift开源项目精选

    Swift 开源项目精选-v1.0 2016-03-07 22:11 542人阅读 评论(0) 收藏 举报  分类: iOS(55)   Swift(4)    目录(?)[+]   转自 http: ...