He hecho este fragmento de búsqueda simple. Lo hice para buscar en mi matriz (matriz de elementos) y si el valor de entrada es exactamente igual a uno de los nombres de los elementos y ese elemento regresará.
Así que aquí, si buscamos 'manzana' en el campo de entrada, el siguiente resultado devolverá
{ color: "rojo", nombre: "manzana"}
Mi pregunta es: sin regresar de acuerdo con el valor exacto de la entrada, ¿podemos devolver un valor como el valor de entrada? Por ejemplo, en lugar de escribir la palabra 'apple' cuando escribimos las letras iniciales de la palabra 'apple' como 'ap', espero devolver el objeto apple y el objeto apex que incluye 'ap' (quiero devolver todos los objetos que contienen el nombre como 'ap' de la matriz) como lo hace una función de búsqueda normal. Gracias si a alguien le gusta ayudarme. A continuación está mi código.
//array const elements = [{name: 'apple',color: 'red'},{name: 'apex', color: 'white'},{name: 'bat', color: 'black'}]; //find function const searchElement = (elementsArray,keyword) => { const returnedElement = elementsArray.find((element,index) => { return element.name.toLowerCase() === keyword.toLowerCase(); }); return returnedElement; } //keyup event document.getElementById('myInput').addEventListener('keyup', () => { const keyword = document.getElementById('myInput').value; const result = searchElement(elements,keyword); console.log(result); }); <input type="text" placeholder="Search" id="myInput">Basado en tu pregunta, creo que mi solución puede ayudarte.
const elements = [{name: 'apple',color: 'red'},{name: 'apex', color: 'white'},{name: 'bat', color: 'black'}]; //find function const searchElement = (elementsArray,keyword) => { var result = []; elementsArray.forEach((element,index) => { if (element.name.toLowerCase().includes(keyword.toLowerCase())) { result.push(element); } }); return result; } //keyup event document.getElementById('myInput').addEventListener('keyup', () => { const keyword = document.getElementById('myInput').value; const result = searchElement(elements,keyword); console.log(result); });Creo que esto es lo que quieres. Use filtro en lugar de eso.
//array const elements = [ { name: "apple", color: "red" }, { name: "apex", color: "white" }, { name: "bat", color: "black" } ]; //find function const searchElement = (elementsArray, keyword) => { const returnedElement = elementsArray.filter((element, index) => { return element.name.toLowerCase().includes(keyword.toLowerCase()); }); return returnedElement; }; //keyup event document.getElementById("myInput").addEventListener("input", () => { const keyword = document.getElementById("myInput").value; const result = searchElement(elements, keyword); result.forEach((item) => console.log(item.name)); }); <input type="text" placeholder="Search" id="myInput">Tu puedes hacer:
const elements = [{name: 'apple',color: 'red'},{name: 'apex', color: 'white'},{name: 'bat', color: 'black'}] const myInput = document.getElementById('myInput') myInput.addEventListener('keyup', () => { const keyword = myInput.value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&') const filterFn = ({ name }) => name.match(new RegExp(keyword, 'i')) const result = elements.filter(filterFn) console.clear() console.log(result) }) <input type="text" placeholder="Search" id="myInput">