var fname = document.getElementById("fName"); var lname = document.getElementById("lName"); const btnSave = document.getElementById("btnSave"); const btnDisplay = document.getElementById("btnDisplay"); btnSave.addEventListener("click", getData); function getData() { console.log( getFullName({ fname: `${fname.value}`, lname: `${lname.value}`, }) ); } function getFullName(FullName) { return FullName.fname + " " + FullName.lname; } <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <link rel="stylesheet" href="main.css" /> </head> <body> <input type="fName" placeholder="First Name" /> <input type="lName" placeholder="Last Name" /> <button id="btnSave">Save</button> <button id="btnDisplay">Display</button> <script src="main.js"></script> </body> </html>¿Cómo obtener el valor del objeto en mi entrada de texto? Devuelve nulo. Pero cuando asigno valor en mi objeto como fName: "John", lName: "Doe" regresa con éxito.
"fname" y "lname" no son identificadores. Ha asignado tipos incorrectamente en sus campos de entrada. En su lugar, haz algo como esto:
<input type="text" id="fname" placeholder="First Name" /> <input type="text" id="lname" placeholder="Last Name" />Sus elementos de entrada no tienen identificadores.
No agregó una identificación a sus etiquetas de entrada.
probar :
<input id="fName" placeholder="First Name" /> <input id="lName" placeholder="Last Name" />