0

假设我有一个按钮列表。每个按钮都属于一个类“.button”。每个按钮直观地显示在其选定状态。每个按钮还有一个样式类，将其与其给定的功能相关联，即；“.widget-1”、“.widget-2”<div class="button widget-1">等等。单击按钮时，我执行：$(this).addClass("selected")

请注意，我有任意数量的按钮，并且我永远不知道在任何给定时间我将拥有多少个按钮，因为列表是数据驱动的，并且在运行时动态调整大小和样式。

然而，当只有一个按钮未被选中时，必须满足条件，即；一个没有添加“.selected”类的按钮。

出于说明目的考虑以下代码：

for (var n = 0; n < Math.round(Math.random() * 10); n++ ) {
    $('<button />').attr({class: 'button widget-' + n})
    .appendTo('body')
    .click(function(){
        $(this).addClass('selected');
        // Am I the last .button without .selected class?
    });
}

这比听起来更棘手：意识到每个按钮在其类中的另一个任意按钮被勾选之前不会知道它是最后一个。

请问有什么帮助吗？

4

1 回答 1

1

用这段代码替换你的点击处理程序主体，这将检查是否有任何其他按钮被选中。

$(this).addClass('selected');
if( $('button.selected').length == 0) {
    alert("This is the last button");
}

如果在将选定的类添加到单击的按钮后，具有“选定”类的按钮集合的大小为零，那么您知道它是最后一个。

现在，您的问题有点模糊，不清楚您是否打算只计算带有“按钮”类的按钮（“我是最后一个没有 .selected 类的按钮”）还是打算计算所有按钮元素。如果您只想计算带有“按钮”类的按钮，那么您可以使用：

$(this).addClass('selected');
if( $('button.button.selected').length == 0) {
    alert("This is the last button");
}
于 2012-05-06T21:03:41.090 回答