1

我有一个表格，在那个表格中我有很多复选框，复选框被归类为 2 个类别，当我选择一个类别时，它的所有子类别复选框都会自动选中，我使用 On submit 按钮作为过滤器，根据选择的复选框过滤选项.

例如：-我有复选框 

                               1]Alcoholic Drinks
                               2]--Beer 
                               3]--Rum
                               4]--Whiskey
                               5]Non Alcoholic Drinks
                               6]--Coffee
                               7]--Tea
                               8]--Juice

我正在使用 jquery 来自动选中复选框。假设用户勾选了Alcoholic，然后它的子复选框自动被选中。

我的代码：-

        $('#Alcoholic').click(function() 
             {                                    

                  if( $(this).attr("checked"))
                 {  

                   $(this).parents('.min-form').find('label.Beer').removeClass('checked'); 
                   $(this).parents('.min-form').find('label.Wine').removeClass('checked'); 
                   $(this).parents('.min-form').find('label.Spirits').removeClass('checked'); 

                 }
                    else 
                 { 

                    $(this).parents('.min-form').find('label.Beer').addClass('checked');
                    $(this).parents('.min-form').find('label.Wine').addClass('checked');                   
                    $(this).parents('.min-form').find('label.Spirits').addClass('checked'); 
                 }                
                  return false; 
             });

当我检查酒精时，它的子复选框会自动被选中。我的问题是，当我提交没有任何操作的表单时，复选框会自动取消选中。我不知道这是怎么发生的？？为什么当我提交表单标签中没有任何操作的表单时复选框会自动取消选中？？？

4

2 回答 2

1

当您在表单中没有任何操作时，它只会重新加载页面 - 因此是空复选框。如果你添加

return false;

单击提交按钮时对您的编码进行编码，它将阻止表单提交（什么都不提交），因此页面不会刷新。

于 2012-12-05T16:46:32.840 回答
1

好吧，从您的代码看来，您是 jQuery 开发的初学者。我建议遵循以下流程。
将类添加到您的顶级类别 chechboxesclass="top"
和 subCategory 复选框添加class="sub"

$(".top").click(function(){
    if($(this).is(':checked'))
    {
        $(this).find('.sub').attr('checked',true);
    }
    else
    {
        $(this).find('.sub').attr('checked',false);
    }
});


您需要确保如果未选中任何子类别复选框，则还必须取消选中父类别。
为此，您需要处理具有class="sub"br/> 的复选框的单击事件希望这有效！:) 是的，请确保拥有return false;

于 2012-12-20T13:25:42.207 回答