Est-ce que je deviens fou? jQuery .click() ne semble pas fonctionner

Le code ci-dessous ne fonctionne pas sur tous les navigateurs. C'est censé montrer une boîte d'alerte. Qu'est-ce que je fais mal?Est-ce que je deviens fou? jQuery .click() ne semble pas fonctionner

<html> 
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script> 
<script type="text/javascript"> 
$('#prevlink').click(function() { 
    alert("Test"); 
}); 
</script> 
</head> 
<body> 
<a id="prevlink" href="#">test</a> 
</body> 
</html>

Source

2010-10-17 nLL

Cela fera une bonne question d'entrevue technique - "Que fait ce code?" –

@Mike: Quand j'ai lu la première partie de votre commentaire, je n'ai pas pu m'empêcher de rire. "Suis-je fou?" : D –

Vous n'emballez pas la fonction dans un ready() event. Il fonctionne avant que le DOM existe.

Source

2010-10-17 14:29:24

merci sur jquery documenttation il n'était pas prêt() – nLL

Mettez-le dans document.ready!

Source

2010-10-17 14:29:44

+1 Bien que la question est techniquement si l'OP est fou. : P –

oh, et vous souhaiterez peut-être retourner false à partir du gestionnaire click() si vous ne souhaitez pas que la page retourne à elle-même. –

Changer votre code:

$(function() 
{ 
    $('#prevlink').click(function() { 
    alert("Test"); 
    }); 
});

Source

2010-10-17 14:32:22 dmitko

Comme le code javascript exécuté avant le code html fini de télécharger Utilisez cette place que votre code

$(document).ready(function(){ 
$('#prevlink').click(function(){ 
    alert("Test"); 
}); 
})

Source

2010-10-17 14:32:37 vener

Vous essayez d'accéder à l'élément avant d' existe (JavaScript est exécuté en ligne avec l'analyse/rendu HTML). Vous pouvez utiliser l'événement ready que jQuery fournit que Pekka et Mike ont fait remarquer, ou tout simplement vous assurer que vous essayez d'accéder à l'élément après il existe:

<html> 
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script> 
</head> 
<body> 
<a id="prevlink" href="#">test</a> 
<script type="text/javascript"> 
// By this time we get here, it exists. 
$('#prevlink').click(function() { 
    alert("Test"); 
}); 
</script> 
</body> 
</html>

L'ancien (en utilisant un événement ou ready similaire) est plus "discret" et c'est très utile lorsque vous travaillez avec de grandes équipes, où vos concepteurs HTML et vos codeurs JavaScript sont généralement différents. Ce dernier se produit plus tôt (pas de petit écart dans le temps après l'apparition du lien et avant que vous ne connectiez l'événement click), tout comme what the Google Closure team recommend pour l'accrochage des gestionnaires d'éléments.

Même lorsque vous utilisez la deuxième méthode, vous pouvez garder votre JavaScript et HTML raisonnablement séparés, en veillant à ce que l'étiquette script est juste un appel à mettre en place l'élément et n'a pas la logique réelle de son propre.

Source

2010-10-17 14:32:42

Ceci est la meilleure réponse. J'ai eu un problème similaire http://stackoverflow.com/questions/19964609/why-doesnt-my-external-jquery-click-event-work-in-jade/19964811#19964811 et bien que les autres réponses ci-dessus l'ont fixé pour moi Je n'ai pas vraiment compris pourquoi jusqu'à ce que tu l'aies expliqué. Si vous soumettez un lien ou une réponse sur ma page, je vais vous donner ma coche verte. Merci. – Squirrl

Est-ce que je deviens fou? jQuery .click() ne semble pas fonctionner

Répondre

Questions connexes