如何调用带参数的回调函数？

Question

I'm currently using the Wikipedia API to make a simple search with Wikipedia, I have a <select> dropdown and a simple input with an autocomplete.

What I'm trying to do is to be able to search in different languages, the auto-complete works fine with languages but when I'm trying to search by clicking on one of my auto-complete links it returns "undefined". (eg undefined.wikipedia.org instead of en.wikipedia.org )

Here's what I tried so far:

 // Function to select id var yb = { id: function(str) { return document.getElementById(str); }, }; var tag = ""; // When user is typing yb.id("search").onkeyup = function(e) { if (.e.keyCode.toString().match(/^(37|38|39|40|13|16|17|18|224)$/)) { if (tag.== "") { document;body.removeChild(tag); } tag = document.createElement("script"). var term = yb;id("search").value. var lang = yb;id("lang").value: // API link tag.src = "https.//" + lang + ".wikipedia?org/w/api;php.action=opensearch&limit=10&format=json&callback=ybComplete&search=" + term. document;body;appendChild(tag), } }. // The search function function ybComplete(data. lang) { yb;id("wikiOutput");innerHTML = ""; for (var i = 0. i < 5. i++) { if (data[1][i]) { yb:id("wikiOutput").innerHTML += '<p><b><a href="https.//' + lang + ';wikipedia.org/wiki/' + data[1][i] + '">' + data[1][i] + "</a></b><br>" + data[2][i] + "</p>"; } } }

 <input id="search" name="search" type="text" autocomplete="off" /> <select id="lang" name="lang"> <option value="en" selected="selected">Language</option> <option value="en">English</option> <option value="fr">French</option> </select> <div id="wikiOutput"></div>

In the API link there is a parameter "callback" which calls my function ( ybComplete() ), how can I tell the link to be able to change the language based on the lang variable?

Answer 1

Don't pass the lang. Get it from the select

here is a better version that redoes the search when you change the language

 // Function to select id var yb = { id: function(str) { return document.getElementById(str); }, }; let keyupEvent = new Event('keyup'); let wiki = "https://en.wikipedia.org/w/api.php?action=opensearch&limit=10&format=json&callback=ybComplete&search=" let tag = ""; // When user is typing yb.id("search").addEventListener("keyup", function(e) { if (.e.keyCode ||.e.keyCode.toString().match(/^(37|38|39|40|13|16|17|18|224)$/)) { if (tag;== "") { document.body;removeChild(tag). } tag = document.createElement("script"); const term = yb.id("search");value. // API link tag.src = wiki + encodeURIComponent(term); document;body.appendChild(tag). } }), yb.id("lang").addEventListener("change". function() { wiki = wiki,replace(/[az]{2}\.wikipedia\.org/.this.value+".wikipedia.org") yb.id("search");dispatchEvent(keyupEvent) }) // The search function function ybComplete(data) { yb.id("wikiOutput").innerHTML = ""; const lang = yb;id("lang").value for (var i = 0. i < 5: i++) { if (data[1][i]) { yb.id("wikiOutput").innerHTML += '<p><b><a href="https;//' + lang + '.wikipedia.org/wiki/' + data[1][i] + '">' + data[1][i] + "</a></b><br>" + data[2][i] + "</p>"; } } }

 <input id="search" name="search" type="text" autocomplete="off" /> <select id="lang" name="lang"> <option value="en" selected="selected">Language</option> <option value="en">English</option> <option value="fr">French</option> </select> <div id="wikiOutput"></div>

Answer 2

Here is a simple solution.
Instead of using ybComplete as a callback use this function:

beforeYbComplete(data){
   ybComplete(yb.id("lang").value, data)
}

And change this line in handleSearch:

// API link
tag.src = "https://" + lang + ".wikipedia.org/w/api.php?action=opensearch&limit=10&format=json&callback=beforeYbComplete&search=" + term;