Question

我有菜单：

<ul>
    <li class="expanded">
        <span class="ui-icon">
        </span>
        <span class="ui-icon">
        </span>
        <label>
            <input type="checkbox" name="" value="45">
            111111111
        </label>
        <ul id="ch-content-menu" class="ui-widget-content">
            <li class="expanded">
                <span class="ui-icon ui-icon-triangle-1-se">
                </span>
                <label>
                    <input type="checkbox" name="" value="18">
                    22222222222222
                </label>
                <ul id="ch-content-menu" class="ui-widget-content">
                    <li class="leaf">
                        <span>
                        </span>
                        <label>
                            <input type="checkbox" name="" value="19">
                            33333333333333
                        </label>
                    </li>
                    <li class="leaf">
                        <span>
                        </span>
                        <label>
                            <input type="checkbox" name="" value="20">
                            4444444444
                        </label>
                    </li>
                </ul>
            </li>
        </ul>
    </li>

</ul>

我想写一个脚本，点击4444444复选框，2222222和1111111自动检查。

我如何用jquery做到这一点？

Answer 1

您必须为“44 ..”复选框“22 ..”复选框和“11 ..”复选框指定ID或名称。

，例如

<input id="44" type="checkbox"/>
<input id="22" type="checkbox"/>
<input id="11" type="checkbox" />

之后，您可以使用该脚本来监控这些元素的操作

$('#44').click(function(){
   $('#22').attr('checked',true);
   $('#11').attr('checked',true);
});

您可以参考jquery网站查看复选框的详细操作。

<强>更新

抱歉，我可能会错过了解提问者。如果你想输出4000个盒子，我认为你必须有一个程序来生成它。由于您不会通过键入生成4000个框。每个元素的ID或名称必须遵循生成规则，在很多时候可以使用频率数字，例如box1，box2，box3 ......所以你仍然像上面一样使用脚本。

如果您想要跟随触发规则的动态触发器，例如是否单击了一个元素，请同时选中下一个框。然后你可以使用

$('input').click(function(){
  var check_index = $(this).index();
  var next1 = check_index+1;
  var next2 = check_index+2;
  $('input#box'+next1+',input#box'+next2).click()});

或者您可以创建用于选择的映射对象

var mapping = {
  'box1':'#box4,#box5',
  'box44444':'#box222,#box111'
  ...
}
$('input').click(function(){
   $(mapping[this.id]).click();
});

当然，您需要有一个程序来生成此映射，该映射通过遵循指定规则生成。但无论您使用何种方法，如果您希望获得稳定的脚本性能，仍需要为要使用的每个元素提供id或name。

最好的方法是使用ID，如果不能，你可能需要使用get（），但是，因为get（）将jquery对象检索到普通的DOM对象，你需要再次用$（）包装它。

var ul3 = $('ul').get(3) // get the last ul
var target = $(ul3).find('input').get(1) // get the 4444 input
$(target).click(function(){
  var ul1 = $('ul').get(0) // get the first ul
  var inputs = $(ul1).find('input') // get all input element under the first ul
  $($(inputs).get(0)).click(); // get and click the first input element
  $($(inputs).get(1)).click(); // get and click the second input element
})

希望它对你有所帮助。

Answer 2

最好的方法是将id属性添加到输入字段中，如果它们很少，但您也可以尝试这个jquery代码：

$('label').click(function(){
    text = $.trim($(this).text())
    if (text == '4444444') {
        $('label').each(function(){
            text = $.trim($(this).text())
            if (text == '2222222' || text == '1111111') {
                $(this).children().attr('checked', true)
            }
        })
    }
})

使用jquery检查多行checkboxtree中的所有父项

2 个答案: