Cómo utilizar un selector global para responder a todos los eventos de clic, excepto en un elemento?

Question

Si tengo un botón:

<button id="button1">

Normalmente me gustaría escribir:

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

Pero quiero definir una función que responde a todos los eventos de clic excepto cuando alguien hace clic en este botón.

¿Hay un selector que me permitiera dirigirse a todos los otros elementos se puede hacer clic en el documento, excepto button1?

Answer 1

Sé que usted ha aceptado la respuesta anterior, pero yo aconsejaría fuertemente en contra de esto. Puede utilizar la delegación evento para hacer lo que quiera con una menor carga para el DOM.

Sé .live () existe pero demasiados manejadores en vivo también impacto en el rendimiento. Yo prefiero estilo de delegación de eventos de edad.

aquí

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

  function clickFn( ev ) {

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

  }

Answer 2

Se puede utilizar el rel="noreferrer"> :

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

El selector anterior coincidirá con todos los elementos del botón, excepto el que tiene id = "botón 1".

Si quieres realmente para seleccionar todos los elementos bajo la etiqueta de cuerpo, se puede utilizar el href="http://docs.jquery.com/Selectors/all" rel="noreferrer"> selector (*), y también excluye los elementos con rel="noreferrer"> o (selector) < a href = "http://docs.jquery.com/Traversing/not#expr" rel = "noreferrer"> no (expr) :.

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

o

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

Si lo hace, usted podría tener algunos problemas de propagación de eventos o de propagación, que puede manejar esto con el función event.stopPropagation .

Answer 3

La corriente CSS 3 selectores Candidato Recomendación define la :root pseuedo clase .

  

El pseudo-clase :root representa un elemento que es la raíz del documento. En HTML 4, esto es siempre el elemento HTML.

Se puede conectar un detector de eventos a la raíz y luego comprobar qué elemento recibió el clic. Si es el elemento que desea ignorar retorno, de lo contrario hacer lo que sea que quieres hacer.