L'action de clic jQuery ne déclenche pas l'attribut onclick

Question

Je rencontre des problèmes pour obtenir une fonction qui clique sur toutes les cases cochées de la recherche. L'événement click semble se déclencher, mais aucune case n'est cochée et myFunc() n'est pas appelée.

Cela fonctionne parfaitement en cliquant sur chaque case à cocher manuellement, mais qui veut faire cela avec plus de 40 cases à cocher - pas mes utilisateurs.
Vous pouvez vous demander pourquoi j'utilise un div-onclick au lieu de directement sur la case à cocher d'entrée. C'est parce que je veux donner à mes utilisateurs une zone plus grande à cliquer sur qu'une petite case à cocher.

Je souhaite fournir à mes utilisateurs un seul lien hypertexte pour sélectionner plusieurs cases à cocher qui correspondent à certaines valeurs d'attribut.

J'ai besoin d'une solution rapide car je suis à court de temps.

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(); 
} 

EDIT
Quand j'ai changé de div-étiquette alors je na pas avoir à corriger l'état de case à cocher. Un div ou un élément de bloc doit présenter un problème.
J'ai également supprimé l'onclick des * div * s, ce qui signifiait que j'étais capable de cibler les cases à cocher directement et que je pouvais changer leur valeur d'ID en seulement * real_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

Plutôt que d'essayer d'utiliser l'événement pour modifier la valeur de la case à cocher, je ferais deux choses:

1. Pour donner aux utilisateurs une grande zone à cliquer, utilisez un élément label, pas div . Les éléments label sont directement supportés par les navigateurs, vous n'avez rien à faire pour les faire fonctionner. Il y a deux façons de les utiliser:

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

   ou

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

   L'ancien est agréable parce que vous ne devez pas utiliser ID (qui doivent être tout à fait unique sur la page, il commence devenir une douleur); ce dernier est bien pour les situations de balisage où vous ne pouvez pas avoir le input être un enfant du label pour une raison quelconque.

2. Si vous devez modifier l'état du code, changez l'état directement plutôt que d'essayer de déclencher un événement. Par exemple, si je veux changer l'état de la case à cocher chk1, je fais ceci:

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

   ... ou effacer toutes les cases à cocher dans un récipient (utile pour les « tous » ou « none "liens):

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

Answer 2

this.parentNode.click devrait être this.parentNode.click().

this.parentNode.click est juste l'objet de la méthode. L'appeler ne déclenchera pas l'événement click de la div. Vous devez ajouter les accolades après click, sinon l'événement ne se déclenchera pas.

Answer 3

Pour donner suite au commentaire de Pointy, utilisez ceci:

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

remplacer simplement quelque chose comme ça pour tout élément est que vous essayez de capturer l'événement de clic pour.

Answer 4

vient de résoudre un problème comme celui-ci, lié au gestionnaire d'événements de case à cocher rendu par ASP.net comme le code js dans l'attribut onclick, que je voulais déclencher. J'ai d'abord essayé d'appeler explicitement jQuery click event, mais après un certain temps j'ai réalisé que je ne réussirais pas de cette façon. Donc, la solution qui a fonctionné pour moi est:

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

Cheers.