Question

我有一个常见问题解答页面，我希望包含搜索功能，这样人们就不必阅读整个页面来查找他们想要的内容。

jQuery("#search_submit").on("click", function () {
    //var search_str = jQuery("#search_text").val();console.log(search_str);
    findString('');
    return false;
});

var TRange=null;

function findString (str) {
    str = document.getElementById('search_text').value;//jQuery("#search_text").val();
    if (parseInt(navigator.appVersion)<4) return;
    var strFound;
    if (window.find) {

        // CODE FOR BROWSERS THAT SUPPORT window.find

        var original_content = window;
        strFound=original_content.find(str);
        if (!strFound) {
            strFound=original_content.find(str,0,1);
            while (original_content.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，但我不确定我做错了什么。它仅搜索搜索文本输入字段之前的部分页面。

以下是jsfiddle上的所有设置 http://jsfiddle.net/sandyrig/h86knpsq/1/

尝试搜索“stuff”或“lol”这个词，你会知道我的意思。

修改

此外，实际上，当页面加载时，页面中的所有问题都将处于折叠状态，因此我将自定义此脚本，以便即使在折叠的答案中也能找到文本，并在搜索整个页面时取消它。

Answer 1

阅读您链接的页面上的说明。他们通过将输入框放在iframe中，从页面的HTML中排除了输入框。代码中发生的情况是，.find()函数到达input字段后，会切换焦点并重新开始搜索。

尝试对要搜索的文字进行硬编码，使其不在输入字段中，并且您会发现它有效。

工作示例：http://jsfiddle.net/daqb13n0/

另外，正如@CurtisAutery所说，过滤功能会更有意义。如果这是客户的要求，那么您作为专业人士的工作就是向客户解释他们的错误。或者，他们不知道过滤是什么，也没有人问他们。

此外，现在它在页面上随处搜索文本，您想要将结果限制在可用问题和答案内的文本中，对吗？

TL; DR：

如果您希望它在您链接的页面上工作：输入输入 iframe。
如果你想提供一个好的产品：说服客户说什么他们想要的是过滤功能。

使用JavaScript在页面上搜索文本

1 个答案: