Элемент 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 находится в разделе head, все остальные функции работают нормально, но эти функции запускаются с помощью событий onClick.

Пожалуйста, кто-нибудь может помочь мне решить эту проблему?

Заранее благодарим вас за вашу помощь.

Answer 1

Вы можете использовать прослушиватель событий следующим образом:

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

Это работает отлично для меня, если это не работает для вас, то у вас есть проблемы в другой части вашего кода, может быть проблема сценарияПожалуйста, посмотрите на консоль браузера, нажав F12.

. Также внесите некоторые изменения здесь:

>  <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>