He copiado varios ejemplos de este y otros sitios sobre cómo agregar opciones a una lista desplegable de HTML, pero aún no sucede nada. Aquí está mi guión:
<!DOCTYPE html> <html><head></head> <body> <form> <select name="p1customer" id="p1customer" onclick="addPC()"> <option>Apple</option> </select> <button type="button" onclick="addPC()">Insert option</button> </form> <script> function addPC(){ let x = document.getElementById("p1customer"); let option1 = document.createElement("pc1"); option1.text = "myCustomer"; x.add(option1); } </script> </body> </html>Ya sea que haga clic en mi menú desplegable o en el botón, la opción nunca se agrega. He colocado funciones de alerta después de cada línea de código y he verificado que los objetos existen, pero el método x.add no hace nada. No agrega la opción a mi lista.
¿Qué me estoy perdiendo?
Simplemente tuve que asignar un valor a la opción como se ve a continuación y todo funciona.
function addPC(){ let x = document.getElementById("p1customer"); let option1 = document.createElement("pc1"); option1.text = "myCustomer"; option1.value = "myC"; x.add(option1); }Tienes dos errores en tu código:
pc1 no es un nombre de etiqueta. por lo que no puede usarlo en la función createElement .x.appendChild en lugar de x.add .function addPC() { let x = document.getElementById("p1customer"); let option1 = document.createElement("option"); option1.text = "myCustomer"; x.appendChild(option1);