Javascript按id检查引导复选框

我有以下表格：

<form class="form-inline" role="form">
    <div class="col-xs-3">
        <div class="pic-container">
            <div class="checkbox">
                <label>
                    <input type="checkbox" name="discounting" onchange='handleChange(this);' id='check11' > Show only price-discounted products
                </label>
            </div>

        </div>
    </div>
    <div class="col-xs-3">
        <div class="pic-container">
            <div class="checkbox" id='check21'>
                <label>
                    <input type="checkbox" name="discounting" onchange='' id='check21'> Show only price-discounted products
                </label>
            </div>
        </div>
    </div>
</form>

仅显示价格折扣产品
仅显示价格折扣产品

我希望在选中第一个复选框后，能够使用JavaScript自动选中第二个复选框。我尝试使用以下脚本：

<script>        
function handleChange(cb) {
    if(cb.checked == true) {
       alert('Message 1');  
       document.getElementById("check21").checked = true;
    } else {
       alert('Message 2');
       var x = document.getElementById("check21").disabled= false;
    }
}
</script>

功能手柄更换（cb）{
如果（cb.checked==true）{
警报（“消息1”）；
document.getElementById（“check21”）.checked=true；
}否则{
警报（“消息2”）；
var x=document.getElementById（“check21”）.disabled=false；
}
}

---

但是它不起作用，因为我认为引导是一个类的问题

为第二个单选按钮使用不同的名称

 <input   type="checkbox" name="discounting21">

---

只能有一个选定的单选按钮属于同一组（即名称）

Didier指出的问题是，有两个元素具有相同的ID：

<div class="checkbox" id='check21'>

及

调用

document.getElementById（'check21'）

可能会（因为行为未定义）返回第一个元素，在本例中是

元素，而不是复选框

不能在两个HTML元素上使用相同的ID，因此需要更改其中一个元素的ID。

我把boostrap作为外部参考

<div class="checkbox" id='check22'>
    <label>
        <input type="checkbox" name="discounting" onchange='' id='check21'> Show only price-discounted products
    </label>
</div>

仅显示价格折扣产品

修复重复id似乎有效。

---

如果不起作用，问题可能在代码的另一部分

您必须检查id为

的项目21

（

div

和

input

。您的问题可能与此相关？不，不是从那里开始的问题。更正问题。谢谢！那么您是否在div上有ID？首先它在那里，然后它消失了，现在又在那里。我创建了一个没有ID的小提琴，我相信它可以按照您的要求工作。您能检查一下吗k我在评论中链接的JSFIDLE，看看这是否是你想要的？嗨，小提琴上有完美的东西，但我没办法让它在我的小提琴上工作。我应该添加盆景库吗？不，盆景只是一个错误；）没有库。好吧，我完全迷路了。我想我有库冲突，因为它仍然不起作用。有没有办法检查任何冲突？你应该在函数中添加一个console.log来准确地知道什么是：

document.getElementById（“check21”）

。你可能有另一个重复的Id？

<div class="checkbox" id='check22'>
    <label>
        <input type="checkbox" name="discounting" onchange='' id='check21'> Show only price-discounted products
    </label>
</div>