jquery comment obtenir le bouton qui a ouvert la boîte de dialogue

Question

J'ai une boîte de dialogue qui est ouverte par plusieurs boutons. Comment puis-je savoir quel bouton a ouvert ce dialogue?

$('#dialog').dialog({ 
    autoOpen: false, 
    buttons: { 
    "Ok": function() { 
     $(this).dialog("close"); 
    }, 
    "Cancel": function() { 
     $(this).dialog("close"); 
    } 
    }, 
    open: function(event, ui) { 
    //HERE ::: how to get an HTML OBJECT TO THE ELEMENT THAT OPENED THE DIALOG 
    } 
}); 

Ceci est appelé par:

$('a').live('click',function(){ 
    $('#dialog').dialog('open'); 
}); 

Je veux savoir qui <a> tag a appelé cette boîte de dialogue. Est-ce possible?

Merci!

Answer 1

Dans votre .live() gestionnaire, vous pouvez stocker une référence à l'élément qui a été cliqué sur l'utilisation .data(), comme ceci:

$('a').live('click',function(){ 
    $('#dialog').data('opener', this).dialog('open'); 
}); 

ensuite pour obtenir plus tard vous pouvez l'attraper de $('#dialog').data('opener'), ou $.data(this, 'opener') dans le cas du rappel open (parce que this fait référence à l'élément de dialogue). Par exemple, votre fonction open peut ressembler à ceci:

open: function(event, ui) { 
    $(this).html("Hi, I was opened by: " + $.data(this, 'opener').id); 
} 

Cela montrerait la propriété id de l'ancre que vous avez cliqué sur pour ouvrir la boîte de dialogue ... vous pouvez faire ce que vous voulez vraiment, $.data(this, 'opener') fait référence à la <a /> DOM élément.

You can give try a demo of this here

Answer 2

faisant l'hypothèse que vous avez un bouton comme tel:

<input type="button" class="mybuttons" value="Click Me"/> 

et certains css comme:

.openerclass 
{ 
    background-color: red; 
} 

ajouter cette classe lorsque vous cliquez dessus

$(function() 
{ 
    var myevent; 
    $(".mybuttons").click(function(event){ 
     myevent = $(event.target); 
     $(".selector").dialog("open"); 
    }); 

    $(".selector").dialog({ 
     open: function(event, ui) { 
     var opener = $(event.target); 
     myevent.addClass("openerclass"); 
     alert(myevent.nodeName); 
     ... } 
    }); 
}); 

Edit: corriger l'erreur de syntaxe et ajouter un autre exemple pour le rendre clair

Edit2: L'original était erroné (sorte de) en ce que l'événement opener n'est PAS associé à l'événement click. Modifié pour utiliser correctement l'événement click.

Answer 3

Vous pouvez lui donner un id:

$('a').live('click',function(){ 
     $('#dialogTrigger').removeAttr('id'); 
     $(this).attr('id', 'dialogTrigger'); 
     $('#dialog').dialog('open'); 
} 

open: function(event, ui) { 
    // do something with $('#dialogTrigger') 
} 

Answer 4

Vous pouvez attribuer $(this) à une variable comme me et de l'utiliser plus tard:

$(".locked").on('click',function unlock(){ 
    var me = $(this); 

buttons: { 
     "Yes": function() { 
      me.removeAttr('disabled').removeClass('locked'); 
     }