jquery - en commençant par l'élément passé en fonction via ce pointeur

Je suis très nouveau à jQuery, donc cela peut être une question vraiment stupide. :-) Je suis en train de faire quelque chose comme le travail suivant:jquery - en commençant par l'élément passé en fonction via ce pointeur

<html> 
<head> 
    <title>JQuery test</title> 
    <script type="text/javascript" src="http://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 
     google.load("jquery", "1"); // Load jQuery 

     function DoSomething(link) 
     { 
     $(link).after('<div>hello world!</div>'); 
     } 
    </script> 
</head> 
<body> 
    <a href="javascript: DoSomething(this);">Click!</a> 
</body> 
</html>

En ce moment, cela ne semble pas faire quoi que ce soit. Mais si je change la ligne à:

$('a').after('<div>hello world!</div>');

Ensuite, une DIV est insérée. Cependant, je veux utiliser un élément passé dans la fonction pour contrôler où l'élément est inséré. Fondamentalement, je ne peux pas comprendre comment lancer une requête jQuery basée sur un élément passé à une fonction via le pointeur "this".

Merci pour l'aide,

~ Justin

Source

2009-10-11 RationalGeek

Avec jQuery, vous pouvez généralement éviter d'insérer tout javascript dans votre code HTML du tout, par exemple: href="javascript: ..." ou href="#" onclick="...". Une manière plus simple consiste à écrire une requête pour cibler cet élément et appliquer le comportement à partir de là. Le moyen le plus simple de cibler l'élément est de lui donner un identifiant, mais vous pouvez utiliser n'importe quelle méthode.

<a href="#" id="myLink">Click!</a>

et votre jQuery:

$('#myLink').click(function() { 
    $(this).after("<div>hello world!</div>"); 
});

A l'intérieur du event handling functions, this fait référence à l'élément DOM qui a été ciblé par l'événement.

Si vous souhaitez obtenir un objet jQuery à partir d'un élément - il suffit de passer au constructeur:

$(domElement)

Vous pourriez avoir des problèmes en raison de la façon dont vous appelez le gestionnaire. Essayez de changer votre lien vers ce style:

<a href="#" onclick="doSomething(this)">

Rappelez-vous simplement de faire doSomething() return false

Source

2009-10-11 23:59:54 nickf

Merci pour la réponse. Je suppose que je pourrais faire quelque chose comme ça. Il y aura plusieurs liens sur la page qui ont besoin d'appeler la fonction, donc je devrais leur attribuer une classe ou quelque chose, et attacher la fonction à tous les liens de cette classe. Mais, je voudrais voir ma question répondue juste pour que je puisse comprendre plus de jQuery. – RationalGeek

oh ... righty édition maintenant ... – nickf

Changement de Click! à * fait * travail. Une idée de pourquoi cela fait une différence? – RationalGeek

Changement <a href="javascript: DoSomething(this);">Click!</a>-<a href="#" onclick="doSomething(this)"> fonctionne.

this n'a de sens que dans les fonctions JavaScript. Les gestionnaires d'événements comme onclick sont une sorte de fonction. Javascript: les pseudo-URL ne sont pas des fonctions. Ils ne sont pas exécutés dans le contexte d'un objet sur la page. Ils sont juste une chaîne. Cliquer sur le lien revient à saisir cette chaîne dans la barre d'adresse du navigateur. Par conséquent this donnera la valeur par défaut window, l'objet global, qui est toujours passé lorsqu'il n'y a pas d'objet particulier this. Javascript: les pseudo-URL sont un désastre complet et ne devraient jamais être utilisés pour quoi que ce soit (à l'exception des bookmarklets). Le formulaire onclick est préférable, mais n'oubliez pas d'ajouter return false; afin qu'il ne suive pas le lien # et saute en haut de la page.

(élément non-lien avec onclick, ou un bouton de style peut être plus approprié qu'un lien, selon ce que le quelque chose est que DoSomething fait.)

Source

2009-10-12 02:18:30 bobince

Excellente info merci. – RationalGeek

jquery - en commençant par l'élément passé en fonction via ce pointeur

Répondre

Questions connexes