html表格 <select>元素不会触发onChange（）

Question

我正在尝试从元素触发javascript函数以使用值更新文本框形式，但是我遇到了一个小问题，该函数未触发。

我在Google上检查了问题，尝试了所有尝试，但我在同一个地方，我的元素未触发我的JavaScript函数

 function CheckPolenta() { console.log("here i'm"); alert("here i'm alert"); } 

 <form name="xs_formulario" action="compra-send.php" method="POST" id="xs_formulario" class="xs-form"> <div class="form-group"> <input type="text" class="form-control" name="name" placeholder="Nombre" id="xs_contact_name"> <input type="email" class="form-control" name="email" placeholder="Correo" id="xs_contact_email"> <p align="center"><strong>Seleccioná las Opciones que Queres en tu Plan de Hospedaje</strong></p> <input type="url" class="form-control" name="dominio" placeholder="Dominio, ejemplo www.tunombre.com" id="dominio"> <p>Registro de Dominio<br> <label><input type="checkbox" name="xs_dominio_pago" value="dpago" id="xs_dominio_pago" onClick="ChooseDPago()">Dominio Pago</label><br> <label><input type="checkbox" name="xs_dominio_propio" value="dpropio" id="xs_dominio_propio" onClick="ChooseDPropio()">Dominio Propio</label><br> <label><input type="checkbox" name="xs_dominio_gratis" value="dgratis" id="xs_dominio_gratis" onClick="ChooseDGratis()">Dominio Gratis (.tk / .ml / .ga / .cf / .gq)</label> </p> <p> Tipo de Pago<br> <label> <input type="checkbox" name="xs_mensual" value="mensual" id="xs_mensual_0" onClick="ChooseMensual()"> Mensual</label> <label> <input type="checkbox" name="xs_mensual" value="anual" id="xs_mensual_1" onClick="ChooseAnual()"> Anual</label> <br> </p> <input type="radio" value="Basico" name="hosting" onClick="CheckPlanPrice()" id="xs_PlanBasico"> Hospedaje Básico<br> <input type="radio" value="Intermedio" name="hosting" onClick="CheckPlanPrice()" id="xs_PlanIntermedio">Hospedaje Intermedio<br> <input type="radio" value="Avanzado" name="hosting" onClick="CheckPlanPrice()" id="xs_PlanAvanzado">Hospedaje Avanzado<br><br> <select id="xs_desarrollo" name="xs_desarrollo" onChange="CheckPolenta()"> <option value="nada">Sin Diseño</option> <option value="html">Web HTML5</option> <option value="wordpress">Wordpress</option> <option value="eshop">Tienda en Línea</option> <option value="galeria">Galería</option> <option value="foro">Foros</option> <option value="social">Red Social</option> </select><br> <div id="total_pagar" name="total_pagar" align="justify">Total a Pagar <input type="text" id="total_pesos" name="total_pesos"> Pesos.</div><br> <textarea name="massage" placeholder="Algun otro comentario, que quiera agregar a su orden" id="x_contact_massage" class="form-control" cols="30" rows="10"></textarea> </div> <div class="xs-btn-wraper"> <input name="xs_contact_submit" type="submit" class="btn btn-primary" id="xs_contact_submit" value="Enviar Ahora"> </div> </form> 

我的javascript函数位于头部，其他所有函数均正常运行，但这些函数是使用onClick事件触发的。

请任何人可以帮助我解决此问题？

预先感谢您的所有帮助。

Answer 1

您可以像这样使用事件监听器：

<script>
    document.getElementById("xs_desarrollo").addEventListener("change", function() {
         console.log("here i'm");
         alert("here i'm alert");
    })
 </script>

它对我来说是完美的，如果对您不起作用，那么您的代码其他部分可能是脚本问题，请按F12在浏览器控制台上查看。

Ans还可以在此处进行一些修改：

>  <select id="xs_desarrollo" name="xs_desarrollo" >
>             <option value="nada">Sin Diseño</option>
>             <option value="html">Web HTML5</option>
>             <option value="wordpress">Wordpress</option>
>             <option value="eshop">Tienda en Línea</option>
>             <option value="galeria">Galería</option>
>             <option value="foro">Foros</option>
>             <option value="social">Red Social</option>
>         </select>