Boostrap 3活动状态按钮。如何获得总活动按钮？

Question

在页面I有许多按钮活动状态。我绑定到事件单击并检查有多少按钮具有活动状态。但是当我点击第一个按钮时，我得到零。

$(".btn-quote").on("click", function (e) {
    var totalActiveQuote= $(".btn-quote.active").length;

    if (totalActiveQuote > 0) {
        console.log("active");
    } else {
        console.log("deactive");
    }
});

我该怎么做才能解决这个问题？

jsfiddle.net

https://jsfiddle.net/haqkbvbh/

Answer 1

你可以通过例如：

来规避这一点

$(document).ready(function(){
 $(".btn-quote").on("click", function (e) {
        $(this).toggleClass("active");
        var totalActiveQiote = $(".active").length;

        $("#totalActive").html(totalActiveQiote);
    });
});

https://jsfiddle.net/zpqcac1h/

Answer 2

这是因为在active事件触发后切换onClick类。您可以通过自己切换来修复它。

$(document).ready(function(){
  $(".btn-quote").on("mouseup", function (e) {
    $(this).toggleClass("myActive");
    var totalActiveQiote = $(".btn-quote.myActive").length;
    $("#totalActive").html(totalActiveQiote);
  });
});