Question

这是我的代码我不知道为什么这不起作用？

<script type="text/javascript" >
var increment2=0;
$('.checkbox').live('change', function() {
    $('.number').html( '(' + (increment2 += this.checked ? 1 : -1) + ')');             
})
</script> 
<td><input type="checkbox" class="checkbox" name="cb" value="1"> 1 </td>
<div class="number">
hello
</div>

即使这段代码也不起作用

var increment2=0; 
        $('.checkbox').live('click', function() { 
            if ($(this).attr('checked') === 'checked') {
                increment2+=10;                 
            } else {
                increment2-=10;
            }
            $('.number').html( '( hello ' + increment2 + ')');             
    })

Answer 1

从jQuery 1.7开始，live方法为deprecated。

如果您使用的是更新版本，则应使用on。并确保指定此事件处理以执行when the DOM is fully loaded。

var increment2=0;
$(function() { // $.ready
    $('.checkbox').on('change', function() {
        $('.number').html( '(' + (increment2 += this.checked ? 1 : -1) + ')');
    });
});

Answer 2

因此，当我使用非常旧版本的jQuery时，您的代码运行良好。

＆＃13;

var increment2=0;
$('.checkbox').live('change', function() {
    $('.number').html( '(' + (increment2 += this.checked ? 1 : -1) + ')');             
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<td><input type="checkbox" class="checkbox" name="cb" value="1"> 1 </td>
<div class="number">
hello
</div>

＆＃13;

所以我的猜测是你使用的是不支持live的现代版jQuery。因此，您需要将on与事件委派一起使用。

＆＃13;

var increment2=0;
$(document).on("change", ".checkbox", function() {
    $('.number').html( '(' + (increment2 += this.checked ? 1 : -1) + ')');             
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<td><input type="checkbox" class="checkbox" name="cb" value="1"> 1 </td>
<div class="number">
hello
</div>

＆＃13;

Jquery增量/减量价格复选框

2 个答案: