Haga clic en Acción jQuery no desencadena onclick atributo

Question

Estoy teniendo problemas para conseguir una función que hace clic en todas las casillas de verificación de búsqueda emparejado. El evento click parece fuego, pero ninguna casilla de verificación se comprueba ni myFunc () llamada.

Funciona perfectamente cuando se hace clic en cada casilla manualmente, pero ¿quién quiere hacer eso con más de 40 casillas de verificación -. No mis Los usuarios Usted puede preguntarse por qué utilizo un div-onclick en lugar de directamente en la casilla entrada. Esto se debe a que quiero dar a mis usuarios una mayor Zona de hacer clic en una casilla de verificación de pequeña.

Quiero ofrecer mis usuarios con un solo enlace para seleccionar las casillas de verificación múltiples que coinciden con cierto valor de atributo (s).

Necesito una solución rápida ya que estoy fuera de tiempo.

HTML

<div id="container">
<a href="#" onclick="clickAndCheckAllMatch('search for this text');return false;">some text</a>
<div id="*actual_ID*" onclick="myFunc(a, b, c, d);">
  <input type="checkbox" id="book-*actual_ID*" onclick="this.parentNode.click;return false;">
</div>
</div>

JS

function myFunc(a, b, c, d) {
  // does stuff
}
function clickAndCheckAllMatch(value) {
  $('div[onclick*='+value+']').each(function(idx,e){
  $('book-'+this.id).click();
}

Editar
Cuando pasé de div a etiqueta a continuación, que no tuve que corregir el estado casilla de verificación. Un div o bloque de elementos debe tener algún problema allí.
También quité la onclick de los * div * s, lo que significaba que era capaz de dirigirse a las casillas de verificación directamente y podría cambiar sus valores de ID a sólo el * ACTUAL_ID *.

function clickAndCheckAllMatch(value) {
  $('input[onclick*='+value+']').each(function(idx,e){
    // e == this
    $(this)[0].click();
    if ($(this).attr('disabled')) {
      //do nothing
    } else {
      if ($(this).attr('checked')) {
        //do nothing
      } else {
        $(this)[0].click(); // only one checkbox per ID
      }
    }
  });
}
function CheckAll() {
  $('#container input[type=checkbox]:not(:checked)').each(function(idx,e){
    $(this).click(); // notice the difference ?
  });
}

Answer 1

En lugar de intentar utilizar el evento para cambiar el valor de la casilla de verificación, lo haría dos cosas:

1. Para dar a los usuarios una gran área para hacer clic, utilice un elemento label, no un div. label elementos están soportados directamente por los navegadores, usted no tiene que hacer nada para que funcionen. Hay dos maneras de usarlos:

   <label><input type='checkbox'>Foo</label>
   

   o

   <input type='checkbox' id='chk1'><label for='chk1'>Foo</label>
   

   La primera es agradable, ya que no tiene que utilizar los identificadores (que tienen que ser totalmente único en la página, por lo que empieza a llegar a ser un dolor); este último es agradable para situaciones de marcado en el que no se puede tener la input ser un hijo de la label por cualquier razón.

2. Si es necesario cambiar el estado en el código, cambie el estado directamente en lugar de tratar de activar un evento. Por ejemplo, si quiero cambiar el estado de la casilla de verificación chk1, acabo de hacer esto:

   $('#chk1').attr("checked", true); // or false, of course
   

   ... o para desactivar todas las casillas de verificación en un recipiente (útil para esos "todos" o enlaces "ninguno"):

   $('#container input[type=checkbox]').attr("checked", false); // or true, of course
   

Answer 2

Sólo resolvió un problema de este tipo, en relación con controlador de eventos de casilla de verificación emitido por ASP.net como el código js en el atributo onclick, que quería gatillo. Primero probé con una llamada explícita evento click jQuery, pero después de un tiempo me di cuenta de que no tendrá éxito esta manera. Así que la solución que funcionó para mí es:

someOtherObject.click(eval($('input').attr('onclick')));

Saludos.

Answer 3

this.parentNode.click debe ser this.parentNode.click().

this.parentNode.click es sólo el método objeto. Llamándolo no se disparará el evento click del div. Debe agregar las llaves después de click, de lo contrario el evento no se disparará.

Answer 4

Para Seguimiento del comentario de puntiagudo, utilice la siguiente:

$(document).ready(function(){
  $('.theAnchorTagClass').click(function(){
    //Code to check all boxes here or do whatever else you need...
  });
});

Sólo sustituto de algo así como que por cualquier elemento que sea que está tratando de capturar el evento click para.