【问题标题】:Search on page script搜索页面脚本
【发布时间】:2023-07-07 18:34:01
【问题描述】:

我一直在尝试创建一个可以在页面上搜索文本的有效搜索栏。我想要完成的正是 Ctrl+F 所做的,但在页面上用户的输入字段中。到目前为止,我有这个在桌面版本上运行良好,但在移动浏览器上不起作用:

<form id="f1" name="f1" action="javascript:void()" onsubmit="if(this.t1.value!=null &amp;&amp; this.t1.value!='')
parent.findString(this.t1.value);return false;">
<input type="text" id="t1" name="t1" value="" placeholder="Type here.." size="20">
<input type="submit" name="b1" value="Search">
</form>

<script>
    var TRange=null;

function findString (str) {
 if (parseInt(navigator.appVersion)<4) return;
 var strFound;
 if (window.find) {

  // CODE FOR BROWSERS THAT SUPPORT window.find

  strFound=self.find(str);
  if (!strFound) {
   strFound=self.find(str,0,1);
   while (self.find(str,0,1)) continue;
  }
 }
 else if (navigator.appName.indexOf("Microsoft")!=-1) {

  // EXPLORER-SPECIFIC CODE

  if (TRange!=null) {
   TRange.collapse(false);
   strFound=TRange.findText(str);
   if (strFound) TRange.select();
  }
  if (TRange==null || strFound==0) {
   TRange=self.document.body.createTextRange();
   strFound=TRange.findText(str);
   if (strFound) TRange.select();
  }
 }
 else if (navigator.appName=="Opera") {
  alert ("Opera browsers not supported, sorry...")
  return;
 }
 if (!strFound) alert ("String '"+str+"' not found!")
 return;
}
</script>

我发现这个代码here 似乎很旧。它可以工作,但不适用于任何移动浏览器。所以我很感激任何关于实现这一目标的有效方法的建议。谢谢!

【问题讨论】:

  • ctr-f 是堆栈中对我来说最有用的键盘快捷键之一。期待这个问题发展成为对许多人非常有用的东西。

标签: javascript jquery search uisearchbar


【解决方案1】:

搜索后,我找到了 Jeff Baker 的 this script,它的功能完全符合我的需要。在这里发布以防其他人正在寻找类似的东西!

【讨论】: