使用搜索/过滤器下拉列表更改值变量

Question

我有这个搜索/过滤器下拉列表，它将allNameMuseums()方法的数组作为值，即["ACQUARIUM"，"Museo2"，"Museo3"]。

<h2>Search/Filter Dropdown</h2>
<p>Click on the button to open the dropdown menu, and use the input field to search for a specific dropdown link.</p>
<div class="dropdown">
<button onclick="myFunction()" class="dropbtn">Dropdown</button>
<div id="myDropdown" class="dropdown-content">
<input type="text" placeholder="Search.." id="myInput" onkeyup="filterFunction()">
</div>
</div>

我有全局变量name，每次我单击搜索/过滤器下拉列表的值之一时，名称都会使用该值，即如果我单击 ACQUARIO，那么name将是 ACQUARIO。

document.addEventListener("DOMContentLoaded", function(event) {
allNameMuseums().forEach(function(item) { // ITERAZIONE
document.getElementById("myDropdown").innerHTML += '<a onclick="fnclick(this)">' + item + '</a>';
})
});
var name; //globle variable so you can access in your method
function fnclick(obj) {
name = obj.innerHTML;
console.log(name);
}

function myFunction() {
document.getElementById("myDropdown").classList.toggle("show");
}
function filterFunction() {
var input, filter, ul, li, a, i;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
div = document.getElementById("myDropdown");
a = div.getElementsByTagName("a");
for (i = 0; i < a.length; i++) {
if (a[i].innerHTML.toUpperCase().indexOf(filter) > -1) {
a[i].style.display = "";
} else {
a[i].style.display = "none";
}
}
}
function allNameMuseums() {
return ["ACQUARIO", "Museo2", "Museo3"];
}

我有两个异步方法，specificoMuseo(name)和allMuseums()，以及一个采用allMuseums()方法结果的变量var data = proof;。我希望当我单击搜索/过滤器下拉列表的ACQUARIO时，变量"data"将specificoMuseo("ACQUARIO")的结果作为输入。

specificoMuseo(name).then(proof2 => {
allMuseums().then(proof => {
var data = proof;
});
});

Answer 1

您可以使用await关键字代替promise：

var data = await specificoMuseo("ACQUARIO"); // This is like proof2
var data2 = await allMuseums(); // This is like proof

如果要并行运行此过程，因为任何承诺都相互依赖，则可以使用以下方法Primise.all：

Promise.all([specificoMuseo("ACQUARIO"), allMuseums()])
.then(([proof2, proof]) => {
// ...
})

使用await关键字：

var [proof2, proof] = Promise.all([specificoMuseo("ACQUARIO"), allMuseums()])

编辑：

当您单击"ACQUARIO"时，此功能将被触发fnclick(this)

function fnclick(obj) {
name = obj.innerHTML;
var [proof2, proof] = Promise.all([specificoMuseo(name), allMuseums()])
console.log(name);
}