Bootstrap复选框/单选按钮不会更改<input>值

jam*_*her 20 html javascript checkbox radio-button twitter-bootstrap

BootstrapJavaScript页面显示了一些很好用的按钮来设置复选框和无线电字段的样式.例如,对于复选框,我可能会写

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary">
    <input type="checkbox"> Option 1
  </label>
</div>
Run Code Online (Sandbox Code Playgroud)

但是,库实际上并不会更改基础<input>字段的值- 它只会更改<label>字段是否具有类active.我原以为它会改变checked复选框上的属性.显然我不只是错误配置 - 这是Bootstrap网站上的示例工作方式.

这实际上是预期的行为吗?如果是这样,它似乎相当无用,因为人们想要使用复选框字段.如果没有,我如何正确配置Bootstrap复选框/单选按钮?

tom*_*roo 37

checked输入中的属性没有被修改,因为当检查复选框输入时不会改变 - checkedDOM属性是更改(true或false),Bootstrap正确处理(你可以检查Firebug中的元素和在切换它们时看到DOM属性更改).该checked属性仅用于在最初呈现DOM时确定默认值.

如果您碰巧使用复选框/无线电做任何js/jQuery,请记住这一点!如果您需要以编程方式检查复选框或单选按钮,$('input').attr('checked', 'checked');则无法完成工作.$('input').prop('checked', true);是你需要的.

这不是Bootstrap按钮的特殊行为,这是所有复选框/无线电的工作方式.

编辑:Firebug截图

编辑2:从评论中添加了文本,因为它似乎很有帮助.

  • @jameshfisher如果您碰巧使用复选框/无线电做任何js/jQuery,请记住这一点!如果你需要以编程方式检查复选框或单选按钮,`$('input').attr('checked','checked');`将无法完成工作.`$('input').prop('checked',true);`就是你所需要的. (18认同)