Checkbox ne fonctionne pas correctement pour IE avec jquery

Question

J'essaie d'utiliser plusieurs cases à cocher asp.net sur une page, en les désactivant en conséquence.

<asp:CheckBox ID='chkMenuItem' runat='server' CssClass='HiddenText' Text='Test'  onclick='<%#String.Format("checkChild({0});", Eval("id")) %>' /> 

javascript, je suis en utilisant le code suivant

function checkChild(id) { 
      for (i = 0; i < $("input[id*=hdnParentMenuItemID]").length; i++) { 
       if ($('input[id*=hdnParentMenuItemID]')[i].value.split(':')[0] == id) { 
        var childID = $('input[id*=hdnParentMenuItemID]')[i].value.split(':')[1]; 
        if ($("#" + childID).attr("disabled")) 
        //$("#" + childID).attr('disabled', ''); 
         $("#" + childID).removeAttr("disabled"); 
        else 
         $("#" + childID).attr('disabled', true); 
       } 
      } 
     } 

est maintenant les cases à cocher sont désactivées une fois que la page est chargée, la section removeAttr ne fonctionne pas. J'ai essayé de passer par le débogueur et la logique fonctionne parfaitement bien. Si les cases à cocher ne sont pas désactivées lors du chargement de la page, le code fonctionne correctement. J'ai essayé de remplacer les 'attributs' désactivés par 'vérifié' pour voir si les autres attributs fonctionnent bien et cela fonctionne parfaitement bien. J'ai essayé

mais cela n'a pas fonctionné non plus.

Remarque: Il fonctionne parfaitement sur FF et Chrome, mais ne fonctionne pas dans IE.

Merci,

Answer 1

J'ai eu des problèmes similaires permettant un <asp:CheckBox /> dans Internet Explorer en utilisant jQuery. Le code suivant a parfaitement fonctionné dans FireFox.

$('myCheckBox').removeAttr('disabled'); 

Cependant, il n'a pas pu fonctionner correctement dans IE.

Un <asp:CheckBox /> est rendu comme <span /> avec un <input /> et un <label />. Lorsque la case à cocher est désactivée, les balises span et input sont décorées avec l'attribut disabled. Pour obtenir le comportement attendu je le code suivant:

$('myCheckBox').removeAttr('disabled'); 
$('myCheckBox').closest('span').removeAttr('disabled'); 

Answer 2

Cela devrait déf. travailler

$('#' + childID)[0].disabled = false; 

Answer 3

Vous voulez une instruction if comme celui-ci

if ($("#" + childID + ":disabled").length) // is childID disabled? 
    $("#" + childID).removeAttr("disabled"); // enable it 
else 
    $("#" + childID).attr('disabled', 'disabled'); // disable it 

Answer 4

Il y a des tas de sélecteurs redondants ici qui vont faire cette fonction très inefficace. Tout d'abord, l'exécution de requêtes pour les sélecteurs est très lente par rapport au reste du code, cachez donc le résultat de votre sélecteur et travaillez dessus. En outre, vous devez déclarer i avec l'opérateur var pour le rendre local à votre fonction. Et il n'est pas nécessaire pour jQuery d'obtenir un élément par son ID ou ce truc profondément confus pour obtenir et définir son statut désactivé, ce qui peut être fait beaucoup plus simplement avec la propriété booléenne DOM disabled. Tout cela dit, je ne sais pas vraiment pourquoi votre code ne fonctionne pas, mais le rendre lisible et simple va certainement aider.

function checkChild(id) { 
    var input, checkBox, parts, inputs = $("input[id*=hdnParentMenuItemID]"); 
    for (var i = 0, len = inputs.length; i < len; i++) { 
     input = inputs[i]; 
     parts = input.value.split(':'); 
     if (parts[0] == id) { 
      checkBox = document.getElementById(parts[1]); 
      checkBox.disabled = !checkBox.disabled; 
     } 
    } 
}