Passer des paramètres aux événements click() et bind() en jQuery ?

Question

Je veux passer quelques paramètres à click() dans jQuery, j'ai essayé ce qui suit mais cela ne fonctionne pas :

commentbtn.click(function(id, name){
    alert(id);
});

Et aussi si nous utilisons le bind alors comment nous allons le faire :

commentbtn.bind('click', function(id, name){
    alert(id);
});

Answer 1

Voir données de l'événement

commentbtn.bind('click', { id: '12', name: 'Chuck Norris' }, function(event) {
    var data = event.data;
    alert(data.id);
    alert(data.name);
});

Si vos données sont initialisées avant de lier l'événement, il suffit de capturer ces variables dans une fermeture.

// assuming id and name are defined in this scope
commentBtn.click(function() {
    alert(id), alert(name);
});

Answer 2

D'où tirez-vous ces valeurs ? Si elles proviennent du bouton lui-même, vous pourriez simplement faire

commentbtn.click(function() {
   alert(this.id);
});

S'il s'agit d'une variable dans le champ d'application de la liaison, vous pouvez y accéder à partir de sans

var id = 1;
commentbtn.click(function() {
   alert(id);
});

S'il s'agit d'une variable dans la portée de la liaison, cela pourrait changement avant que le clic ne soit appelé, vous devrez créer une nouvelle fermeture

for(var i = 0; i < 5; i++) {
   $('#button'+i).click((function(id) {
      return function() {
         alert(id);
      };
   }(i)));
}

Answer 3

Une alternative à la méthode bind().

Utilisez la méthode click(), faites quelque chose comme ceci :

commentbtn.click({id: 10, name: "João"}, onClickCommentBtn);

function onClickCommentBtn(event)
{
  alert("Id=" + event.data.id + ", Name = " + event.data.name);
}

Ou, si vous préférez :

commentbtn.click({id: 10, name: "João"},  function (event) {
  alert("Id=" + event.data.id + ", Nome = " + event.data.name);
});

Il affichera une boîte d'alerte avec les informations suivantes :

Id = 10, Name = João

Answer 4

var someParam = xxxxxxx;

commentbtn.click(function(){

    alert(someParam );
});