javascript - 输入类型复选框在 Bootstrap 模式中不起作用

标签 javascript twitter-bootstrap

为什么 Bootstrap 模式中的复选框不起作用?

我使用这段代码使其工作但仍然有问题

documentBody.on('click','.checkInp',null,function(e) { 
    var checkbox = $(this).find(":checkbox"),
    checked = checkbox.is(":checked"); 
    checkbox.prop("checked", !checked);

});

documentBody.on('click','.checkInp :checkbox',null,function(e) { 
  $(this).parent('span').trigger('click');

}); 

当我点击它时,未选中时没有选中,或者选中时未选中?但如果我单击跨度区域,复选框将标记为选中或取消选中

这是我的 fiddle

最佳答案

我猜你试图克服点击事件中的 Bootstrap 模式 e.preventDefault() - 这就是它永远不起作用的原因。这两个事件似乎也相互排斥?

试试这个:

$('.checkInp input:checkbox').on('click', function(e) {

    // prevents the event from bubbling up the DOM tree
    // eg the modal from cancelling the event
    e.stopImmediatePropagation();

    var checked = (e.currentTarget.checked) ? false : true;
    e.currentTarget.checked=(checked) ? false : checked.toString();
});

fork fiddle :http://jsfiddle.net/AurPX/

关于javascript - 输入类型复选框在 Bootstrap 模式中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17696321/

相关文章:

javascript 通过对象递归

css - Bootstrap 输入字段的大小

ruby-on-rails - 如何在我的 Rails 项目中手动包含 twitter bootstrap(不使用任何 gem)?

html - 删除您无权编辑的 CSS 属性

javascript - 如何在 Electron 应用程序中包含 bootstrap 4

html - Bootstrap 页脚 - 如何将其右对齐并留出间距

javascript - 可以保存对 Canvas 2d 上下文的引用吗?

javascript - Vue.js 不会坚持多个实例

javascript - 将这行代码转换为 jQuery

Javascript 使用正则表达式将文本转换为对象