Wie verwendet man einen globalen Selektor, um auf alle Klick-Ereignisse außer auf ein Element zu reagieren?

Question

Wenn ich eine Taste:

<button id="button1"> 

Normalerweise würde ich schreiben:

$("#button1").click(function() 
{  
    //do something 
} 

Aber ich möchte eine Funktion definieren, die außer auf alle Click-Ereignisse reagiert, wenn jemand auf diese Schaltfläche klickt.

Gibt es einen Selektor, der es mir ermöglichen würde, alle anderen anklickbaren Elemente im Dokument als Ziel zu adressieren, außer button1?

Answer 1

Ich weiß, dass Sie die Antwort oben akzeptiert haben, aber ich würde stark davon abraten. Sie können Ereignisdelegierung verwenden, um das zu tun, was Sie wollen, mit viel weniger Aufwand für das Dom.

Ich weiß. Live() existiert aber zu viele Live-Handler beeinflussen auch die Leistung. Ich bevorzuge Event-Delegation alten Stil.

Demo here

$(function(){ 
    $('body').click(clickFn); 
    }); 

    function clickFn(ev) { 

    if (ev.target.id != 'button1'){ 
     //do your stuff 
     console.log('not a #button1 click'); 
    } 

    } 

Answer 2

könnten Sie die :not selector verwenden:

$('button:not(#button1)').click(function(){ 
    //Do something 
}); 

Die obige Selektor werden alle Tastenelemente entsprechen, mit Ausnahme der mit id = "button1".

Wenn Sie wirklich alle Elemente unter dem Body-Tag auswählen möchten, können Sie die "All" (*) Selektor verwenden, und schließen auch die Elemente mit :not(selector) oder .not(expr):

$('body *:not(#button1)').click(function(){ 
    //Do something 
}); 

Oder

$('body *').not('#button1').click(function(){ 
    //Do something 
}); 

Wenn Sie dies tun, könnten Sie einige Ereignis Blasenbildung oder Vermehrungsprobleme haben, können Sie dies mit der Funktion umgehen.

Answer 3

Die aktuelle CSS 3 Selectors Candidate Recommendation definiert die :root pseuedo class.

Die :root Pseudo-Klasse repräsentiert ein Element, das die Wurzel des Dokuments ist. In HTML 4 ist dies immer das Element HTML.

Sie könnten einen Ereignis-Listener an den Stamm anhängen und dann prüfen, welches Element den Klick erhalten hat. Wenn es das Element ist, das Sie ignorieren möchten, tun Sie alles, was Sie tun möchten.