欢迎来到361模板(www.ke361.com),原创精品织梦模板提供商。QQ快速注册登录 网站托管 VIP 网站定制

361模板网

当前位置:361模板网 > 技术文档 > 网站技巧 > 手机移动端实现输入框弹出键盘带搜索按钮的实现方法
这篇文章主要为大家详细介绍了手机移动端实现输入框弹出键盘带搜索按钮的实现方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,有需要的朋友可以收藏方便以后借鉴。

可能不少朋友理解不了意思,看看下面的361源码的演示截图就应该明白了,

手机移动端实现输入框弹出键盘带搜索按钮的实现方法

那么如何在用户点击input时弹出带有搜索按钮的键盘,其实很简单,加上 type="search"即可。

代码如下:

<input id="keyword" placeholder="输入关键字搜索" type="search" />

实现获取搜索按钮的点击事件的代码如下:

$("#keyword").on('keypress',function(e) {
                                var keycode = e.keyCode;
                                var searchName = $(this).val();
                                if(keycode=='13') {
                                        e.preventDefault();
                                        //请求搜索接口 
                                           
                                }
                  });

 

在注释后面加上你想添加的事件,就可以啦。可以使用alert("test");试试看哦。

最后再说明一下,这个方法在PC端也是可以用的,但是这时不会弹出键盘,物理键盘中的ENTER键的作用等同于搜索按钮。

聪明的你看到这里应该就会理解和明白了。

以上就是手机移动端实现输入框弹出键盘带搜索按钮的实现方法的全部内容,希望对大家的学习和解决疑问有所帮助,也希望大家多多支持361模板网。

感谢打赏,我们会为大家提供更多优质资源!

热词标签: 手机端 移动端 搜索按钮

上一篇移动网站建设和优化需要避免的几大误区

下一篇织梦dedeCMS常用的几种字段判断输出实例介绍

取消

感谢您的支持,我们会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

Powered by361模板网,分享从这里开始,精彩与您同在