关键词：
很多时候在移动端的web页面中, 需要使用搜索功能, 然而页面中并没有太多的空间来放置一个像pc端上那样的搜索按钮, 这时候就需要借用手机输入法自带的搜索按钮来实现点击搜索
虽然不是什么大的功能, 但是确实很实用, 实现的效果有一下两点
1. 点击input元素, 弹出的键盘右下角显示为 "搜索" 二字
2. 点击搜索时, 可以出发页面中的js事件
代码如下
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> 7 <script src="//cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script> 8 </head> 9 <body> 10 <form id="myform" action="" onsubmit="return false;"> 11 <input id="myinput" type="search"> 12 </form> 13 </body> 14 <script> 15 //这两种都能用, 一个是在form上加id 一个是在input元素加id 16 //对于苹果手机添加一个form元素是必要的,否则只能实现功能但是键盘的文字不能变成搜索字样 17 // $(‘#myform‘).bind(‘search‘, function () { 18 // //coding 19 // alert(1); 20 // }); 21 $(‘#myinput‘).bind(‘search‘, function () { 22 //coding 23 alert(1); 24 }); 25 </script> 26 </html>
移动端页面布局
...pp分类1、NativeApp原生app手机应用程序 使用原生的语言开发的手机应用，Android系统用的是java，ios系统用的是object-C2、HybridApp混合型app手机应用程序 混合使用原生的程序和html5页面开发的手机应用3、WebApp基于Web的app手机应... 查看详情
web移动端开发使用啥框架比较好？
...现，下面再来总结下还有哪些框架是适合面向手机设备的开发的。 1、jQueryMobile jQueryMobile是jQuery在手机上和平板设备上的版本。jQueryMobile不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整统一的jQuery移动UI框架... 查看详情
vue全家桶开发android和ios移动端应用常见问题解决(代码片段)
1、input获取焦点弹出键盘时遮住input web页面有多个input输入框时，底部的input获取焦点弹出键盘，会出现遮住input情况，用户输入的内容不能正常展示，需要手动上滑。如下图一键盘遮住了备注输入框，图二... 查看详情
怎么随时呼出手机键盘
...就是手机自带的键盘了，不过自带的键盘基本不适合我们使用。样打开手机自带的键盘，你可以尝试，进入任何手机自带的app，点击进入后点击搜索就是放大镜🔍，然后手机自带的键盘就弹出对于安卓手机自带的键盘都是AOS... 查看详情
移动端input输入框实现自带键盘“搜索“功能并修改x(代码片段)
主要利用html5的，input[type=search]属性来实现，此时input和type=text外观和功能没啥区别；html代码入下:<formaction=""id="myform"><inputtype="search"id="input"value=""placeholder="快速搜索"results="5"/></form>但要实现点击键盘右下 查看详情
手机端怎么使用chatapi
...消息提示等。 参考技术CChatAPI是一种聊天API，它可以帮助开发者在移动应用中实现聊天功能。可以使用ChatAPISDK来实现在不同的平台（iOS、Android、Web）及其 查看详情
手机端浏览器中的html搜索框如何响应软键盘搜索按钮事件？
...和baidu等网站一样不单独加一个搜索按钮在页面上，而是使用输入法软键盘里的搜索按钮或图标来触发事件。javascript里面如何响应这个搜索按钮事件？有什么独特的事件么？谢谢！很简单，input框外面加form表单即可。 <form&... 查看详情
移动端页面布局
...pp分类1、NativeApp原生app手机应用程序 使用原生的语言开发的手机应用，Android系统用的是java，ios系统用的是object-C2、HybridApp混合型app手机应用程序 混合使用原生的程序和html5页面开发的手机应用3、WebApp基于Web的app手机应... 查看详情
html5移动端web
...onAPI本地存储以及离线应用WebWorkers、WebWebSocketAPI移动前端开发可分为：手机网页开发。这部分跟web前端开发差别不大，使用的技术都 查看详情
6.0移动端页面布局(代码片段)
...端app分类1、NativeApp原生app手机应用程序使用原生的语言开发的手机应用，Android系统用的是java，iOS系统用的是object-C2、HybridApp混合型app手机应用程序混合使用原生的程序和html5页面开发的手机应用3、WebApp基于Web的app手机应用程序... 查看详情
html5与移动端web
...onAPI本地存储以及离线应用WebWorkers、WebWebSocketAPI移动前端开发可分为：手机网页开发。这部分跟web前端开发差别不大，使用的技术都是html+ 查看详情
调试移动端页面
调试移动端页面分为两种开发时，移动设备连接上PC起的服务调试移动设备上的页面手机连接PC的本地服务在开发移动设备页面时，常用CHROME自带的模拟移动设备外，还需要有真机去测试一下，而不是布到测试服务上去之后，再... 查看详情
js移动端如何监听软键盘回车事件
移动端经常项目中会有搜索之类的功能,一般实现的是按搜索按钮进行搜索,如果要像PC端一样实现按回车键进行搜索该怎么实现呢?方法很简单,就是在搜索框的input外面套一个form标签 注意点:form标签一定得添加action属性(可设置... 查看详情
web前端之移动端课程开发之06.bootstrap(代码片段)
Bootstarp介绍bootstarp是Twitter公司开发基于html,css,js的前端框架为实现web应用程序快速实现开发提供了一套前端工具包UI（userInterface用户界面）框架Bootstrap的特性响应式设计(css媒体查询一套样式实现各个终端尺寸适配)pc平板... 查看详情
web前端之移动端课程开发之06.bootstrap(代码片段)
Bootstarp介绍bootstarp是Twitter公司开发基于html,css,js的前端框架为实现web应用程序快速实现开发提供了一套前端工具包UI（userInterface用户界面）框架Bootstrap的特性响应式设计(css媒体查询一套样式实现各个终端尺寸适配)pc平板... 查看详情
借助freehttp为任意移动端web网页添加vconsole调试(代码片段)
...sole介绍vConsole是一个轻量、可拓展、针对手机网页的前端开发者调试面板。 使用vConsole的项目可以让手机上的Web浏览器，拥有类似PC调试工具的能力。正常情况下使用vConsole需要修改项目 查看详情
webapp(web开发移动web开发)
... 1、移动web基础知识 移动web开发和web开发没有本质的区别：都是使用html（html5）、css（css3）、js、以及一些相关的技术在开发 只不过移动web开发更侧重于移动端（手机、ipad）的显示，使页面在更... 查看详情
dayu200|分布式遥控器(代码片段)
...于OpenHarmony的分布式能力和RPC通信能力，UI使用eTS进行开发。如下图所示，分别用两块开发板模拟TV端和手机端。分布式组网后可以通过TV端界面的Controller按钮手动拉起手机端的遥控界面，在手机端输入时会将输入的内... 查看详情