pulsanti jQuery UI Dialog

Question

quando si crea una finestra di dialogo con i pulsanti come:

buttons: { 
      'button text': function(){        
       // do something 
      }, 

devo accesso al pulsante all'interno del gestore di eventi click?

$(this) 

è l'oggetto contesto/jQuery dell'intera finestra di dialogo.

dubito devo essere così creativo come

$(this).find('button').attr(...) 

per portatori di handicap un pulsante lì?

Answer 1

La documentazione per dialog() dice:

La chiave di proprietà è il testo del pulsante . Il valore è la funzione di callback per quando si fa clic sul pulsante . Il contesto della callback è l'elemento di dialogo; se è necessario l'accesso al pulsante, è disponibile come destinazione dell'oggetto evento.

$('#myDialog').dialog({ 
    'title': 'My Dialog Header', 
    'buttons': { 
     'My Button': function(event) { 
      // here is the modification of the button 
      // opacity set to 25%, all events unbound 
      $(event.target).css({opacity: 0.25}).unbind(); 
     } 
    } 
}); 

Answer 2

Il formato dei pulsanti nella finestra di dialogo è una <button> con un <span> dentro, in questo modo:

<button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only"> 
    <span class="ui-button-text">Button text</span> 
</button> 

Quindi, quando si fa clic, l'attuale evento click accade su quel <span> o <button>, a seconda del vostro stile (margine sul arco per esempio), in modo da ottenere la <button> solo fare il tuo gestore di salire al pulsante anche se sei già su di esso, in questo modo:

buttons: { 
    'button text': function(e){ 
    $(e.target).closest("button") //this is the button, do something with it :) 
    } 
} 

Here's a quick demo of this working