Question

我的页面上有几个名称和id = selectArticle []的复选框。我需要的是，每当用户选中复选框时，某些元素应该附加class =“required”，当我取消选中同一个框时，应该删除class =“required”。

我尝试过.addClass和.removeClass，但每当我取消选中该复选框时，都不会发生.remove效果。但是，当我再次选中复选框时（如果是.toggleClass），该类完全切换。它似乎只适用于复选框'checked'事件而不是未选中。

通过警告，我已经检查过，检查/取消检查事件都被完全解雇了.removeClass / .toggleClass根本不起作用。

如何纠正此问题。请帮帮我!!!

       $("input[name='selectArticle[]']:checkbox").live('change',function(){
          var n = $("input[name='selectArticle[]']:checked").length;
          var id=$(this).val();
          var v = $(this).is(':checked');
          //var vr= $("input[name='selectArticle[]']:unchecked").val();
          //var vr= $(this).val();
          alert(v);
          alert(id);
          //alert("url"+v);
          if($(this).is(':checked'))
          {

            alert('#url'+v);
            $("#title"+id).toggleClass('required');
            $("#id"+id).toggleClass('required');
            $("#url"+id).toggleClass('required url');
            $("#category"+id).toggleClass('required');
            $("#group"+id).toggleClass('required');
          }
          else
          {
            alert("balls"+id);
            ("#title"+id).toggleClass('required');
            $("#id"+id).toggleClass('required');
            $("#url"+id).toggleClass('required url');
            $("#category"+id).toggleClass('required');
            $("#group"+id).toggleClass('required');
          }
         // $("div").text(n + (n <= 1 ? " is" : " are") + " checked!" + " value :" + v);
    });

更新：以下答案

    $("input[name='selectArticle[]']:checkbox").live('change',function(){
          var n = $("input[name='selectArticle[]']:checked").length;
          var id=$(this).val();
          var v = $(this).is(':checked');
          //var vr= $("input[name='selectArticle[]']:unchecked").val();
          //var vr= $(this).val();
          alert(v);
          alert(id);
          //alert("url"+v);
          if($(this).is(':checked'))
          {

            alert('#url'+v);
            $("#title"+id).addClass('required');
            $("#id"+id).addClass('required');
            $("#url"+id).addClass('required url');
            $("#category"+id).addClass('required');
            $("#group"+id).addClass('required');
          }

         if(!$(this).is(':checked'))
          {
            alert("balls"+id);
            $("#title"+id).removeClass('required');
            $("#id"+id).removeClass('required');
            $("#url"+id).removeClass('required url');
            $("#category"+id).removeClass('required');
            $("#group"+id).removeClass('required');
          }
         // $("div").text(n + (n <= 1 ? " is" : " are") + " checked!" + " value :" + v);
    });

Answer 1

原始问题的问题在于您在UPDATE中有两个IF语句。第一个是UNCHECKED框，如果它是CHECKED但是第二个IF语句将重新检查该框，因为它现在是UNCHECKED。

如果你仍然有这种设置，那么没有什么能正常工作，因为你只是来回翻转状态。确保你只有IF-A-THEN-B-ELSE-C而不是IF-A-THEN B，后面跟着IF-B-THEN-A。

希望这会有所帮助。： - ）

Answer 2

由于toggleClass无效，请尝试

if($(this).is(':checked'))
{
    $("#title"+id).removeClass('required');
    ...
}
else
{
    $("#title"+id).addClass('required');
    ...
}

确保您的var id=$(this).val();包含有效内容，因为("#title"+id)，$("#id"+id)和其他人使用相同的变量。

Answer 3

嗯...

else if($(this).is(':unchecked'))

:unchecked不是有效的jQuery选择器。尝试使用else或：

if(!$(this).is(':checked'))

取消选中复选框时，jQuery .removeClass / .toggleClass无效

3 个答案: