移动端html5网站,如何设置输入框键盘的“搜索”“前往”按钮 - input type

移动端html5网站,如何设置输入框键盘的“搜索”“前往”按钮 - input type,第1张

显示搜索按钮需要满足3个条件:

1.input在form标签中

2.form标签设置了action属性值

3.input设置type为search

示例如下:

<form action="#">

    <input type="search" />

</form>

这种情况下点击搜索按钮会跳转到action对应的地址进行搜索

如果我们需要js来处理搜索逻辑,可以设置form不提交,并且监听输入框的keydown事件

示例如下:

<form action="#" onsubmit="return false">

    <input type="search" id="t_search" />

</form>

<script type="text/javascript">

$("#txt_search").keydown(function (e) {

    if (e.keyCode == 13) {

        //搜索处理

    }

})

</script>

还有一个前往按钮,也类似,把type换成text就可以了,所以form很重要,如果我们不放form,就是“换行”按钮了。

end

1、首先,打开手机safari浏览器,进入浏览器界面。

2、进入主界面后,搜索需要添加到主屏幕的网页。

3、在网页所在的页面,点击下方转发的图标,如图。

4、在d出的选框,下滑,找到并点击【添加到主屏幕】。

5、出现的页面,点击右上角的【添加】即可。

需要准备的材料分别有:电脑、浏览器、html编辑器。

1、首先,打开html编辑器,新建html文件,例如:index.html。

2、在index.html中的<body>标签中,输入html代码(其中icon.png是放大镜图标):。

<div>

<input type="text" />

<img style="width: 20pxposition: absoluteleft: 140pxtop: 15px" src="icon.png" />

</div>

3、浏览器运行index.html页面,此时输入框右边添加了放大镜。


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/bake/7969709.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-04-12
下一篇2023-04-12

发表评论

登录后才能评论

评论列表(0条)

    保存