我制作了一个输入搜索栏,一切正常。我搜索一个 GIF,它带来了结果,当我搜索另一个 gif 时,我会重新搜索所有并带来新的结果。我遇到的问题是,当我尝试选择建议(自动完成)时,它不会将其带到输入搜索栏,因此我可以进行搜索。它更改了 de div 的类(“onClick”、“select(this);),但是当我按下建议时,它对 Onclick 不起作用。谢谢
HTML .
</div>
<div class="sug sug2" id="sugg2">
<a href="#" target="_blank"><img class="lupaSug" src="assets/icon-search.svg" alt="#"></a>
<a class="jsSug" href=""></a>
</div>
<div class="sug sug3"id="sugg3">
<a href="" target="_blank"><img class="lupaSug" src="assets/icon-search.svg" alt="#"></a>
<a class="jsSug" href=""></a>
</div>
<div class="sug sug4" id="sugg4">
<a href="" target="_blank"><img class="lupaSug" id="lupaSug" src="assets/icon-search.svg"
alt="#"></a>
<a class="jsSug" href=""></a>
</div>
</div>
JS
/////////// INPUT SEARCH y SUGERENCIAS////////
let searchInput = document.getElementById('searchInput');
let suggDiv = document.getElementById('suggestion');
let suggestion = document.getElementsByClassName('jsSug');
let results = document.getElementById("results");
let searchString = "";// se carga el valor que se vaya tipeando en el input search.
let indexS = 0;
let suggestDataIndex = []; // se cargan en este¿a variable el array de las sugerencias desde la funcion searchSugg();
////// KEYPRESS SUGERENCIAS Y BUSQUEDA DE GIFOS////////
searchInput.addEventListener("keyup", (e) => {
searchString = e.target.value;
console.log(searchString);
// IF PRESS ENTER
if (e.key === 'Enter') {
// TRAE LOS RESULTADOS DE LOS GIF BUSCADOS//
gifoResult();
// me vacia el input
document.getElementById('searchInput').value = "";
// me hace unfocus en el input
document.getElementById("searchInput").blur();
// me remueve el resultado anterior de GIF, titulo y ver mas
document.getElementById('gifosGrid').remove();
document.getElementById('titleSearch').remove();
document.getElementById('seeMore').remove();
}
else {/// ELSE LLAMA A SUGGESTIONS
searchSugg();
/// FUNCION SI APRIETA UNA SUGERENCIA
for (let index = 0; index < suggestion.length; index++) {
suggestion[index].setAttribute("onClick", "select(this);");
console.log(suggestion[index]);
}
});
function select(element) {
let selectUserData = element.textContent;
console.log(selectUserData);
//searchInput.value = selectUserData;
}