0

我有菜单:

<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做到这一点?

4

2 回答 2

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网站查看checkbox的详细操作。

更新

对不起,我可能会错过理解提问者的意思。如果要输出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
})

希望它可以帮助你。

于 2013-07-16T09:15:01.353 回答
-1

如果输入字段很少,最好的方法是向您的输入字段添加 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)
            }
        })
    }
})
于 2013-07-16T09:26:56.200 回答