Jquery Dom et les fonctions dans le corps html

Question

J'ai <script>...</script> avant mon tag corps de fermeture ici j'ai l'habitude

$(function() { 
    function test(){ 
     alert("test"); 
    } 
}); 

dans mon html j'ai des balises d'entrée <input type="text" onchange="test()" />

Je reçois une erreur de ce test est indéfini. J'essaie de rendre la fonction d'appel IE7 onchange J'ai eu une solution entière de travail, mais depuis IE7 n'aime pas .change() je vais mettre onchange attributs dans les entrées, mais maintenant j'ai ce problème.

Une idée de comment je peux résoudre ce problème?

Answer 1

Si vous utilisez jquery, utilisez jquery partout.

$(document).ready(function(){ 

$('input').bind('change',function(){ 
alert("hi"); 
}); 

}); 

Answer 2

Pour l'utiliser de cette façon, vous en avez besoin en dehors de cette portée, utilisez ne cela, pas document.ready wrap:

function test(){ 
    alert("test"); 
} 

Si vous l'envelopper dans un gestionnaire document.ready, il est uniquement disponible dans ce cadre, vous devez déclarer la fonction à l'extérieur pour cela. Cependant, vous pouvez le faire complètement jQuery aussi bien, comme ceci:

HTML:

<input type="text" id="myElem" /> 

jQuery:

$(function() { 
    $('#myElem').change(function() { 
    alert("test"); 
    }); 
}); 
//or, if you wanted the external function for another reason: 
$(function() { 
    $('#myElem').change(test); 
}); 
function test(){ 
    alert("test"); 
} 

Answer 3

test est inconnu, car il est local à la fonction anonyme (la ready gestionnaire) et non exposée au monde extérieur. Cette fonction est simplement un gestionnaire ready qui est appelé lorsque le DOM de la page est prêt. Si vous souhaitez exposer test que vous devez faire quelque chose comme ceci:

var eventHandlers = $(function() { 
    function test() { 
     alert("test"); 
    } 

    return {test: test}; 
})(); 

C'est un peu exagéré et nécessaire que si vous utilisez le modèle de module et en utilisant l'encapsulation. Vous pouvez maintenant utiliser eventHandlers.test(). Si l'encapsulation est pas un problème, je vous recommande de se lier à jQuery dans le gestionnaire ready:

jQuery(document).ready(function(){ 
    jQuery("#myInput").bind("change", function() { 
     alert("test"); 
    }); 
}); 

Vous pouvez également définir simplement la fonction:

function test() { 
    alert("test"); 
} 

Quelle serait la meilleure façon. Cependant, je recommande de ne pas mélanger différentes façons de faire les choses. Si vous utilisez jQuery, tenez-vous à tout faire avec jQuery.