jQuery 注意输入的变化[type="checkbox"]
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6571948/
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
Watch for change of the input[type="checkbox"]
提问by Iladarsda
How can I run a function on checkbox change?
如何在复选框更改时运行函数？
I'm trying to write small checkbox replacing function base on that - but I'm doing something wrong.
我正在尝试编写基于此的小复选框替换功能 - 但我做错了。
Code:
代码：
(function($) {
$.fn.checking = function() {
if ($('.checbox').prop('checked', false) === true) {
$('.new-checkbox').prop('id', 'unchecked');
} else {
$('.new-checkbox').prop('id', 'checked');
}
};
})(jQuery);
$(document).ready(function() {
$('.checkbox').wrap('<div class="checkbox-wrapper"></div>');
$('.checkbox-wrapper').append('<p class="new-checkbox">Blue = Checked, Red = Unchecked</p>');
$('.checkbox').checking();
$('.checbox').bind('change', function() {
$(this).checking();
});
});
PlayGround: LIVE DEMO
游乐场：现场演示
采纳答案by Felix Kling
You have some typos and errors in your script.
您的脚本中有一些拼写错误和错误。
if($('.checbox').prop('checked', false) === true)
// ^ ^^^^^^^^^^^^^^^^^
should be
应该
if(this.prop('checked'))
if($('.checkbox').prop('checked'))would work too of course, but why select the element again, if you already made it a plugin and the element is available via this?
if($('.checkbox').prop('checked'))当然也可以工作，但是为什么要再次选择该元素，如果您已经将其设为插件并且该元素可通过 获得this？
And
和
$('.checbox').bind('change', function(){
// ^
should be
应该
$('.checkbox').bind('change', function(){
// ^
Working demo: http://jsfiddle.net/fkling/yGBAK/40/
工作演示：http: //jsfiddle.net/fkling/yGBAK/40/
That said, it is better (more logical) to add and remove a class than changing the ID of the element.
也就是说，添加和删除类比更改元素的 ID 更好（更合乎逻辑）。
回答by Jon
Is this what you want? I am under the impression that you are over-complicating things.
这是你想要的吗？我的印象是你把事情复杂化了。
$('input[type="checkbox"]').change(function() {
alert ("The element with id " + this.id + " changed.");
});
回答by YonoRan
$('.checkbox').change(function(){
alert('changed');
})
I usedthe class you placed on the checkbox (.checkbox) for this. It detects a change in the state of the checkbox (this works for other inputs as well)
为此，我使用了您放在复选框 (.checkbox) 上的类。它检测复选框状态的变化（这也适用于其他输入）
The example I included alerts 'changed' one the checkbox is clicked or unclicked.
我包含的示例警报“更改”了复选框被单击或未单击的情况。
If you want to know if it is checked or not every time then:
如果您想知道是否每次都检查它，则：
$('.checkbox').change(function(){
if($(this).is(':checked')){
alert('checked');
} else {
alert('not checked');
}
});
回答by Fereydoon Barikzehy
Try this:
尝试这个：
$('input[type=checkbox]').change(function() {
alert("I'm changed!");
});
Or
或者
$('input[type=checkbox]').change(function() {
if ($(this).is(':checked')) {
alert('I\'\m --> checked');
} else {
alert('I\'\m --> unchecked');
}
});
回答by Kevin Bowersox
In your example the selector uses checbox, should be ".checkbox"
在您的示例中，选择器使用复选框，应为“.checkbox”
I modified your example so it works: http://jsfiddle.net/yGBAK/41/
我修改了你的例子，所以它有效：http: //jsfiddle.net/yGBAK/41/
I swapped the ids for elements.
我交换了元素的 id。
