twitter-bootstrap 输入类型复选框在引导模式中不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17696321/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
input type checkbox not working inside bootstrap modal
提问by Snippet
Why is that checkbox inside the bootstrap modal not working?
为什么引导程序模式中的那个复选框不起作用？
I use this code to make it working but still have a problem
我使用此代码使其工作但仍然有问题
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');
});
when i click it there is no check appears when its unchecked or it is not uncheck when its check? but if i click the span area the checkbox is marked as check or uncheck
当我单击它时，未选中时不显示选中或选中时未取消选中？但如果我点击跨度区域，复选框被标记为选中或取消选中
here is my fiddle
这是我的小提琴
回答by davidkonrad
Guess you try to overcome bootstrap modals e.preventDefault()in click events - this is why it never works. Also the two events seems to obsulete each other?
猜猜你试图克服e.preventDefault()点击事件中的引导模式- 这就是它永远无法工作的原因。这两个事件似乎也相互抵消了？
Try this instead :
试试这个：
$('.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();
});
forked fiddle : http://jsfiddle.net/AurPX/
分叉小提琴：http: //jsfiddle.net/AurPX/
回答by The Wavelength
The solution of davidkonrad is very nice. Although, it does not respect label-Tags. Here's a modified version:
davidkonrad 的解决方案非常好。虽然，它不尊重标签标签。这是一个修改后的版本：
jQuery(".modal input:checkbox,.modal label").on("click", function(e)
{
e.stopImmediatePropagation();
var element = (e.currentTarget.htmlFor !== undefined) ? e.currentTarget.htmlFor : e.currentTarget;
var checked = (element.checked) ? false : true;
element.checked = (checked) ? false : checked.toString();
});
回答by spoon.GJ
I also faced this trouble, and It costed me one day to solve it by Jquery.
我也遇到了这个问题，花了一天时间用jquery解决了。
Unfortunately,there was no easy to be solved by JQuery, but had to switch to other way.
不幸的是，JQuery 没有容易解决的问题，只好改用其他方式。
finally angularjs solved this.
最后 angularjs 解决了这个问题。
try ng-checked.
试试 ng-checked。
<div class="modal fad"
....
<input type="checkbox" class="css-checkbox" ng-checked="checked">
</div>
js:just set it true like
js：只需将其设置为 true 就像
$scope.checked = 'true';
