单击链接并加载新页面后，我该如何运行功能？

Question

我正在使用 cordova 制作一个混合应用程序，目前当用户使用搜索功能时，会返回一个可点击的搜索结果列表，每个结果中都会突出显示用户搜索查询。问题是当用户点击结果并将他们带到所述书中搜索查询的确切位置时，我无法弄清楚如何运行我的突出显示功能以突出显示新加载页面上的搜索查询？这里是 Javascript 的新手，我希望我清楚我想说的话。这是问题https://osaintilien55-gmail.tinytake.com/tt/NDU0MzA5OF8xNDQwMDE2Ng的屏幕记录。我将 Lunr.js 用于搜索功能，将 Mark.js 用于突出显示。

这是我的代码中的搜索功能

 //Add Event Listener to Search button
document.querySelector(".search-btn").addEventListener('click', searchFunction);

function searchFunction() {
    //Clear List
    document.querySelector(".results-wrapper").innerHTML = '';

    //Store query
    var searchQuery = document.querySelector("#search-id").value;

    // returns all documents which contain query
    var results = idx.search(searchQuery);

    var searchResults = results.forEach(function (entry) {

            documents.find(findText);

            function findText(doc) {
                let re = new RegExp(searchQuery, 'i');
                console.log(re);
                if (doc.name == entry.ref && doc.text.match(re)) {
                    //and if entry.text contains search query
                    //Break up string into sentences
                    var sentences = doc.text.match(/[^\.!\?]+[\.!\?]+/g);
                    console.log(doc.text);
                    console.log(sentences);
                    //              console.log("Page " + doc.page + " has the word " + searchQuery + " " + doc.text.search(re));
                    sentences.forEach(function (sentence) {
                        if (sentence.match(re)) {
                            var anchor = document.createElement('a');
                            anchor.className = 'anchorSearchResult'
                            anchor.href = doc.href;

                            //Create "div" element
                            var div = document.createElement('div');
                            div.className = 'div-test'

                            //Creates "h4" element for title
                            var h4 = document.createElement('h4');
                            var title = document.createTextNode(doc.name);
                            h4.className = 'title-results';

                            //Creates "p" element for sentence 
                            var textElement = document.createElement(p);
                            var searchResult = document.createTextNode(sentence);
                            textElement.className = "text-results";

                            //Creates "p" element for page 
                            var p = document.createElement('p');
                            var pageResult = document.createTextNode(doc.page);
                            p.className = "page-results";

                            h4.appendChild(title);
                            textElement.appendChild(searchResult);
                            p.appendChild(pageResult);

                            div.appendChild(h4)
                            div.appendChild(textElement)
                            div.appendChild(p)

                            anchor.appendChild(div)

                            document.querySelector(".results-wrapper").appendChild(anchor);

                            // Highlight Function
                            var instance = new Mark(document.querySelector(".results-wrapper"));
                            instance.mark(searchQuery, {
                                "element": "span",
                                "className": "highlight"
                            })
                        }
                    })
                }
            }

            
            //listen for Click event on searchResult list
            //onWindowsLoad run Highlight function
            //Highlight Function on search query word
            //Pass id Query Selector of search query
            //Highlight each instance of search query in Id's content
        }
        )}

Answer 1

您可以使用查询字符串。例如，函数的参数存储在名为params 的查询字符串中。

您可以读取查询字符串。然后在查询字符串上使用JSON.parse()。然后使用 ES6 扩展运算符 (...) 使用解析后的数组运行函数。

例子：

var params = new URLSearchParams(window.location.search) // Create a URLSearchParams object

function myFunction(a, b, c) {
    alert(a + ' ' + b + ' ' + c)
}

myFunction(...JSON.parse(params.get('params'))) // Run function with parsed params

Example - 尝试更改名为 params 的查询字符串。如果您使用字符串，请使用双引号，因为 JSON 需要双引号，而我们使用的是 JSON.parse()

查询字符串必须是一个数组。例如：

[1, 2, 3]
["One", "Two", "Five"]
[[], [], []]