html 手机输入法 搜索引擎,解决网页搜索框无法使用手机输入法中的“搜索”按钮的问题...

先森之前就发现,“成航先森”在手机上访问使用搜索时,无法使用键盘上的“前往/搜索”按钮。点击没有反应,必须要点击网页中的搜索按钮才行。之前因为懒得管,就一直没有解决这个问题,这两天丑了点时间研究了一下,最后发现这个问题是分阶段的。

“前往”和“搜索”按钮的问题

手机中的输入框,有时候右下角是“前往”,而有时候是“搜索”。先森起初以为是因为先森的搜索框显示的是“前往”,所以无法使用这个按钮。后来先森发现,写一个简单的html页面,通过手机访问,无论是“前往”还是“搜索”,都不会影响点击该按钮的效果。

不过让键盘显示“搜索”还是要显得专业一些。实现方法:

搜索框的type必须是search。

7cc5c039e8e5eda5755b0847bdefd756.png

“前往”与“搜索”

点击输入法中的“搜索”没有反应的原因

上面所说的,按键上无论显示什么文字,都不会影响功能。然而先森的网站中,点输入法上的按钮是死活没有作用,所以原因还是要继续找。

先森本以为是某个JS代码导致了这个问题,所以先森把首页保存到本地,一个个的删除尝试。花费了大概一个小时的时间,终于,先森确认跟JS代码没有任何关系。

最后无意间删了一个标签,结果发现竟然可以了,手机输入法点击“搜索”可以搜索了。

罪魁祸首就是它:

这个base标签的作用是网页中的每个链接都默认为新标签页打开,好不好用就不做累述了。

删除与恢复

删除这个标签就可以实现使用手机输入法中的搜索按钮效果,但是我们想要的新标签页打开网页就没有了。

先森参考网上的JavaScript脚本,新写了一段js代码,从而实现相类似的效果。需要注意的是,不能简单的给每个标签都增加上新标签页打开,因为有些地方不适合新标签页打开,比如页码,每点一次下一页就新开一个窗口,访客要疯了吧?

所以,当标签已经设置了本页打开的需要排除,其他标签才加上_blank属性。

把下面的JavaScript代码放在head某处:

$(function(){

$('body a').each(function(){

if($(this).attr('target')!=='_self'){

$(this).attr('target','_blank');}

});

});

那么,你的网站搜索框能用手机的搜索按钮吗?

历史上的今天:

除特别注明外,本站所有文章均为成航先森 www.capjsj.cn原创,本文共1077个字

转载请注明出处来自https://www.capjsj.cn/mobile_phone_search.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值