Soy bastante nuevo en la codificación, pero he terminado mucho en freecodecamp e hice algunos juegos de adivinanzas simples que aprendí en mozilla.developer. Estoy usando visualStudioCode y practicando. Problema: quiero escribir un nombre en el campo input="text", enviarlo, luego la etiqueta de párrafo debe registrar el apellido del nombre ingresado. He creado dos objetos como usuarios en mi página web. He llegado lo suficientemente lejos como para hacer que la consola registre el nombre en el parámetro, pero... Tal como lo veo, el parámetro de función findPerson( name ) debe ser activado por inputField. ¿Cómo hago esto? Aquí está mi código.
<html> <div class="form"> <label for="inputField"> Enter a users first name, and see their last name. </label> <input type="text" class="inputField" id="inputField" placeholder="Enter search here"> <input type="submit" class="submitBtn" id="submitBtn" value="Search"> </div> <p class="searchResult">Last name will be shown here.</p> </html> <script> const people = [ { firstName: "Arnold", lastName: "Schwarzenegger", hobbies: ["Get pumped", "be awesome"], }, { firstName: "Clint", lastName: "Eastwood", hobbies: ["Make movies", "not being Arnold"], }, ]; const btn = document.querySelector(".submitBtn"); const inputF = document.querySelector(".inputField"); const para = document.querySelector(".searchResult"); function findPerson(name) { let word = String(inputF.value); word = name; for(var i = 0; i < people.length; i++) { if(people[i].firstName == name) { para.textContent = people[i].lastName; return people[i].lastName; } else { para.textContent = "Not found"; } } }; btn.addEventListener("click", findPerson); </script>Lo que está haciendo es que su función findPerson toma el name como en el argumento.
function findPerson(name)Sin embargo, ese argumento de nombre no es el valor del cuadro de texto.
Luego, en la siguiente línea, obtienes el valor del cuadro de texto y lo llamas 'palabra'
let word = String(inputF.value);Pero luego, en la siguiente línea, sobrescribe esa variable de palabra nuevamente con la variable de nombre.
word = name;Luego verifica el nombre de todas las personas con la variable de nombre, pero como se dijo anteriormente, este no es el valor del campo de texto.
Por lo tanto, no tome un argumento para la función. Y asigne un nombre al valor del cuadro de texto haciendo:
function findPerson() { let name = String(inputF.value); .... }Y entonces funcionará.