jquery.val() sur la page fonctionne, hors de la page ne fonctionne pas? Pourquoi?

Question

J'ai eu les éléments suivants:

<script type="text/javascript"> 
var noteid = $('#noteid').val(); 
</script> 
<input type="hidden" name="noteid" id="noteid" value="321"> 

Cela fonctionne très bien ... mais maintenant je suis en train de déplacer le JavaScript de la page dans un fichier JS lié comme ceci:

<script type="text/javascript" src="/js/note_beta.js"> </script> 
<input type="hidden" name="noteid" id="noteid" value="321"> 

Ce poste Le fichier JS a le code: "var noteid = $ ('# noteid'). Val();" mais ça ne marche pas ... Y a-t-il un truc pour que cela fonctionne quand ce n'est pas sur la page elle-même?

Merci

Answer 1

Essayez d'envelopper votre code jQuery dans un (document) fonction .ready, ce qui assure qu'il ne fonctionne pas jusqu'à ce que la page est chargée et que vous ne courez pas le risque d'essayer de faire référence à des éléments avant sont ajoutés au DOM

changer donc:

var noteid = $('#noteid').val(); 

à ceci:

var noteid; // define it up here to ensure scope is done properly 
$(document).ready(function() { 
    noteid = $('#noteid').val(); 
}); 

Answer 2

essayez d'emballage votre code comme celui-ci afin qu'il ne soit pas courir jusqu'à ce que la page est chargée

$(document).ready(function(){ 
    var noteid = $('#noteid').val(); 
}); 

Answer 3

En plus du $ (document) .ready, ne donnent pas toujours une variable JavaScript du même nom comme élément nommé (qui vient habituellement avec des entrées). Cela peut ne pas faire de différence dans ce cas, mais cela peut entraîner des bogues. Check out this article on the scope chain en bas pour plus d'informations. Cela peut facilement vous mordre.

Éditer: la version courte de l'article est que les éléments nommés sont ajoutés à la chaîne de portée, donc si le javascript recherche une propriété .noteid, il utilisera input.noteid au lieu de window.noteid (window.noteid = = var noteid quand déclaré comme une variable globale.)