先森之前就发现,“成航先森”在手机上访问使用搜索时,无法使用键盘上的“前往/搜索”按钮。点击没有反应,必须要点击网页中的搜索按钮才行。之前因为懒得管,就一直没有解决这个问题,这两天丑了点时间研究了一下,最后发现这个问题是分阶段的。
“前往”和“搜索”按钮的问题
手机中的输入框,有时候右下角是“前往”,而有时候是“搜索”。先森起初以为是因为先森的搜索框显示的是“前往”,所以无法使用这个按钮。后来先森发现,写一个简单的html页面,通过手机访问,无论是“前往”还是“搜索”,都不会影响点击该按钮的效果。
不过让键盘显示“搜索”还是要显得专业一些。实现方法:
搜索框的type必须是search。
“前往”与“搜索”
点击输入法中的“搜索”没有反应的原因
上面所说的,按键上无论显示什么文字,都不会影响功能。然而先森的网站中,点输入法上的按钮是死活没有作用,所以原因还是要继续找。
先森本以为是某个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