Question

如果选中值为1的复选框，我希望自动检查值为2的复选框。两者都具有相同的ID，因此我无法使用getElementById。

HTML：

<input type="checkbox" value="1" id="user_name">1<br>
<input type="checkbox" value="2" id="user_name">2

我累了：

var chk1 = $("input[type="checkbox"][value="1"]");
var chk2 = $("input[type="checkbox"][value="2"]");

if (chk1:checked)
      chk2.checked = true;

Answer 1

您需要将HTML和jQuery更改为：

var chk1 = $("input[type='checkbox'][value='1']");
var chk2 = $("input[type='checkbox'][value='2']");

chk1.on('change', function(){
    chk2.prop('checked',this.checked);
});

id是唯一的，您应该使用类。
chk1和chk2的选择器错误，请使用上述'正确连接。
使用 change() 功能检测何时选中或取消选中第一个复选框，然后使用 prop() 更改第二个复选框的选中状态。

<强> Fiddle Demo

Answer 2

错误可能来自"input[type="checkbox"] 您的复选框位于引号之外，因此您查询的是input[type=][value=1]

将其更改为"input[type='checkbox']（在双引号内使用单引号，但不需要引用复选框）

http://api.jquery.com/checked-selector/

Answer 3

您需要更改一个ID。 W3C标准不允许这样做（因此类与ID相比）。 jQuery只会处理第一个ID，但大多数主流浏览器都会将ID视为类似于类，因为他们知道开发人员搞砸了。

解决方案：

<input type="checkbox" value="1" id="user_name">1<br>
<input type="checkbox" value="2" id="user_name_2">2

有了这个JS：

var chk1 = $('#user_name');
var chk2 = $('#user_name2');

//check the other box
chk1.on('click', function(){
  if( chk1.is(':checked') ) {
    chk2.attr('checked', true);
  } else {
    chk2.attr('checked', false);
  }
});

有关使用ID的原因的详细信息，请参阅：Why is it a bad thing to have multiple HTML elements with the same id attribute?

Answer 4

Id应该是唯一的，因此可以为您的元素设置不同的ids，顺便说一下，您必须使用.change()事件来实现您想要的效果。

尝试，

HTML：

<input type="checkbox" value="1" id="user_name1">1<br>
<input type="checkbox" value="2" id="user_name2">2

JS：

var chk1 = $("input[type='checkbox'][value='1']");
var chk2 = $("input[type='checkbox'][value='2']");

chk1.change(function(){
  chk2.prop('checked',this.checked);
});

Answer 5

首先创建一个输入类型复选框：

   <input type='checkbox' id='select_all'/>   


   $('#select_all').click(function(event) {   
            if(this.checked) {
               $(':checkbox').each(function() {
                this.checked = true;                        
              });
            }
           });

选中复选框，如果选中其他复选框

5 个答案: