0

这里放置了所有代码http://jsfiddle.net/tUukv/

下面是在没有 jquery 的情况下创建/显示的复选框。如果复选框值更改,则值is_checkbox_changed0更改为1。所有作品。

<br>input type='checkbox' without jquery. All works<br>
<table><tr><td>
<input type='checkbox' id='checkbox_to_update0' name='checkbox_to_update0' class='checkbox_to_update_changed0' value = 'true' >
</td></tr></table>

<table><tr><td>
<input type="text" name="is_checkbox_changed0" id="is_checkbox_changed0" style='width:30px;'>
<script>
$(".checkbox_to_update_changed0").change(function(){
document.getElementById('is_checkbox_changed0').value = 1;
});
</script>
</td></tr></table>

但需要使用 jquery 显示复选框

创建了这样的代码

<br>But with jquery input type='checkbox' does not work<br>

<script language="javascript" type='text/javascript'>
$(document).ready(function() {
$('#existing_company_error').html("Checkbox <input type='checkbox' id='checkbox_to_update' name='checkbox_to_update' class='checkbox_to_update_changed' value = 'true' ><br>");
});
</script>

<div id="existing_company_error"></div>


<table><tr><td>
<input type="text" name="is_checkbox_changed" id="is_checkbox_changed" size="" style='width:30px;'>

<script>
$(".checkbox_to_update_changed").change(function(){
//$('input[type="checkbox"]').change(function(){
//$(".checkbox_to_update_changed").on("change", function () {
document.getElementById('is_checkbox_changed').value = 1;
});
</script>

</td></tr></table> 

如果我更改复选框值(选中或取消选中复选框)中的值is_checkbox_changed必须更改为1. 但它没有改变。

请指教需要纠正什么?

解决方案哦,我很愚蠢。document.getElementById('is_checkbox_changed').value = 1;必须在里面$(document).ready(function() {。所有作品

4

2 回答 2

3

由于元素是动态创建的,所以使用事件委托

$(document).on('change', ".checkbox_to_update_changed", function(){
    document.getElementById('is_checkbox_changed').value = 1;
});

或者

jQuery(function($){
    $('#existing_company_error').on('change', ".checkbox_to_update_changed", function(){
        document.getElementById('is_checkbox_changed').value = 1;
    });
})
于 2013-09-28T06:23:17.843 回答
0

利用

$(document).on('change', '.checkbox_to_update_changed', function(){

});

您必须使用$(document)将单击处理程序附加到动态添加的元素,因为$(document)始终存在,因此您始终可以附加到它。在这种情况下,专门附加到不存在的元素将不起作用。此外,包装与withjQuery交互的所有代码可能是个好主意,以确保在附加事件等之前加载所有内容。DOM$(document).ready()

(这是我的第一个堆栈溢出帖子!)

于 2013-09-28T06:27:31.760 回答