jquery - jQuery自定义第二个自定义复选框不检查

Question

因此，由于我不喜欢普通的复选框，我决定使用 bootstrap v3 的彩色按钮作为复选框。我做了一个，效果很好（并且处理了一个 POST 请求）。做了一秒钟，它就是行不通。jQuery click 函数根本没有被调用。大家觉得我的问题出在哪里？

http://jsfiddle.net/ZmqwX/

<button id="checkbox" class="btn btn-default">foo</button>
<button id="checkbox" class="btn btn-default">not foo?</button>

$('#checkbox').click(function () {
    $(this).toggleClass("btn-success").attr("value", $(this).hasClass("btn-success"));
    return false;
});

Answer 1

您不能有两个具有相同 ID 的元素，而是使用类名。

$(".anyClass")

Answer 2

你不应该！有两个具有相同 ID 的元素。将您的课程更改checkbox为：

HTML：

<button class="checkbox btn btn-default">foo</button>
<button class="checkbox btn btn-default">not foo?</button>

JavaScript：

$('.checkbox').click(function () {
    $(this).toggleClass("btn-success").attr("value", $(this).hasClass("btn-success"));
    return false;
});

Answer 3

这是正确的使用类而不是 ID 并且总是 ID 应该是唯一的。