3

我在我的网站中使用 ezMark 库以及 PHP、Smarty、jQuery 等。在其中一个网页上,我想根据某些条件禁用几个复选框。之后,有一个父复选框,选择哪个复选框后,所有未禁用的复选框都应被选中,反之亦然,取消父复选框。同样在检查父复选框后,如果我取消选中任何一个选定的复选框(未禁用),父复选框也应该被取消选中。(.attr('checked','checked')我尝试通过常规代码分别检查和取消选中复选框来实现这一点.removeAttr('checked');),但由于 ezMark 库,在这种情况下不起作用。现在我使用以下代码来检查和取消选中复选框,如下所示: 父复选框的代码:

<p id="parentCheckbox" class="custom-form"> 
  <input class="custom-check" type="checkbox" name="" id="ckbCheckAll">
  <a class="drop" href="#">more</a> 
</p>

用于创建多个复选框的 smarty 代码:

{section name=tests loop=$all_tests}
<p class="custom-form"> 
  <input class="custom-check checkBoxClass" type="checkbox" name="" id="" {if $all_tests[tests].is_test_lock!=1 && $all_tests[tests].test_assign_to_package=='no'} {else} disabled {/if}>
  <label>{$all_tests[tests].test_name}</label>
</p>
{/section}

用于在父复选框上选择和取消选择复选框的 jQuery 代码:

$(document).ready(function()  { 
$("#ckbCheckAll").click(function () { 
  if ($(this).is(':not(:checked)'))
    $(".ez-checkbox").removeClass("ez-checked");

  if($(this).is(':checked'))
      $(".ez-checkbox").addClass("ez-checked");
  });
});

当我查看 Firbug 元素检查器时,我得到了为子复选框创建的不同 HTML,如下所示:

<p class="custom-form">
<div class="ez-checkbox ez-checked">
<input id="" class="custom-check checkBoxClass ez-hide" type="checkbox" name=""></input></div>
<label>N1P: Gravitation</label>
</p>

我没有从这个<div>标签的来源获得。因此,为了在选择括号复选框时选中和取消选中所有子复选框,我在上面编写了逻辑。由于此div标签和 ezMark 库,正常逻辑无法正常工作。使用当前代码,所有子复选框都被选中,包括在选择父复选框时禁用的复选框,并且在取消选中父复选框时,所有子复选框都将被取消选中。您能否通过展示如何在这种情况下实现选择和取消选择子复选框的所需功能来提供帮助?提前致谢。

4

1 回答 1

1

jQuery.ezMark生成的结构并不是实现您想要的真正问题。我写这个 jsFiddle是为了向你展示一种基于 css 类来识别父 ( .l0) 和子 ( .l1) 的方法。

我手动禁用了一些示例复选框,但您可以使用您的条件禁用它们。

希望这可以帮到你 ;)

于 2013-10-07T19:50:22.657 回答