web-dev-qa-db-fra.com

La fonction onChange n'est pas définie

Cela doit être quelque chose de simple. J'ai cherché sur Internet et n'ai trouvé que des erreurs de syntaxe comme cause de ce problème, mais je ne trouve pas d'erreur de syntaxe.

Voici le javascript:

<script type="text/javascript" src="http://localhost/acrilart/javascript/jquery-1.6.4.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        function hi(){
            alert('hi');
        }
        hi();
    });
</script>

Et le HTML:

<input type="text" name="cep" value="" id="cep" class="required cep field"
       onChange="hi()" />

Sur pageload, la fonction hi est appelée comme prévu, mais mon événement onChange provoque une erreur Firebug, disant que la fonction n'est pas définie. Je suis vraiment perplexe. Ai-je mal orthographié "salut"?

15
User4407

La fonction hi n'a de portée que dans le gestionnaire d'événements ready. Déplacez-le en dehors du gestionnaire d'événements ou gérez la liaison à l'intérieur (et supprimez l'attribut du gestionnaire d'événements en ligne du balisage):

$(document).ready(function(){
    function hi(){
        alert('hi');
    }
    $("#cep").on("change", hi);
});
20
James Allardice

La fonction hi n'est définie que dans le bloc ready. Dehors, ça n'existe plus.

Vous n'avez pas besoin d'encapsuler les définitions de fonction dans .ready(), supprimez-le donc simplement. Vous pouvez également définir la fonction comme ceci:

window.hi = function() {...}
5
Niet the Dark Absol

Dans votre bloc de code:

<script type="text/javascript">
    $(document).ready(function(){
        function hi(){
            alert('hi');
        }
        hi();
    });
</script>

hi n'est pas une fonction globale. Vous ne pouvez y accéder que dans le cadre de votre function(){...}, pas de l'extérieur.

Puisque vous utilisez jQuery, vous pouvez modifier la façon dont vous liez votre fonction à l'événement onChange. Plutôt que de l'appeler à partir de la balise html, vous pouvez écrire:

<script type="text/javascript">
    $(document).ready(function(){
        function hi(){
            alert('hi');
        }
        hi();

        $('#cep').on( 'change', function(){ hi(); } );
    });
</script>
2
LeGEC
<script src="http://code.jquery.com/jquery-latest.js"></script>

<script type="text/javascript"> 
function hi(){ 
    alert('hi'); 
} 
</script>

<input type="text" name="cep" value="" id="cep" class="required cep field" onKeyPress="javascript:hi();" />
2
Amrish Prajapati

onchange n'est déclenché que lorsque le contrôle est flou. Essayez plutôt onkeypress.

$("#cep").on("change", function() {
   alert(1);
});

o

<input type="text" name="cep" value="" id="cep" class="required cep field" 
onkeypress="hi()"  />

Utilisez les événements suivants au lieu de onchange:

- onkeyup(event)
- onkeydown(event)
- onkeypress(event)
1
Sender