Question

如果使用jQuery检查复选框，我有一些小问题。我有一张桌子，每行都有一个具有相同ID的复选框。

<td><input id="hp" type="checkbox" aria-label="..." checked></td>

这是jQuery函数：

$('#hp').bind("click", function() {
        if($(this).prop('checked')) {
            alert("check");
        } else {
            alert ("unchecked!");
        } 
});

但它只适用于第一行表。有什么建议吗？

Answer 1

尝试

<td><input id="hp" type="checkbox" class='checkBoxClass'></td>

和

$('.checkBoxClass').bind("click", function() {
        if($(this).prop('checked')) {
            alert("check");
        } else {
            alert ("unchecked!");
        } 
});

Answer 2

更改您的代码如下：

HTML代码

<td><input id="hp" class="hp" name="hp[]" type="checkbox" aria-label="..." checked></td>

的Javascript

$('.hp').bind("click", function() {
    if($(this).prop('checked')) {
        alert("check");
    } else {
        alert ("unchecked!");
    } 
});

我希望它适合你。

Answer 3

怎么样？

$('input[type="checkbox"]').bind("click", function() {
        if(this.checked) {
            alert("check");
        } else {
            alert ("unchecked!");
        } 
});

样本 http://jsfiddle.net/n2cgnodp/

Answer 4

因此，ID 必须是唯一的，如果在多个元素上使用#hp，jQuery / JS将只返回第一个元素！

使用 . 类代替：

<强> jsBin demo

<input class="hp" type="checkbox" aria-label="..." checked>

$(".hp").on("change", function(){
   alert(this.checked? "YEY!" : "Not checked :( ");
});

Answer 5

除了为每个复选框提供相同的id之外别无其他方法，请转到以下代码：

$('body #hp').bind("click", function() {
        if($(this).prop('checked')) {
            alert("check");
        } else {
            alert ("unchecked!");
        } 
});

此处$('body #hp')会为您提供与id

相同hp的所有元素

jQuery问题和测试复选框

5 个答案: