Javascript 单击3按钮并禁用其他按钮时发生

我在html页面中有一个名为1、2、3、4和5的5个按钮。如果单击了3个按钮，则必须禁用另一个按钮

var clicking=0;
$(document).ready(function(){
 $('button').click(function(){
 clicking++;
 $(this).toggleClass("active");
  if(clicking==3){
   $('button').click(function(){
   $(this).toggleClass("nothing");
   })
  }
 })
})

我尝试使用此脚本，但它不起作用，因为所有按钮都可以单击。if被忽略。

---

我希望这5个按钮中只有3个可以单击，另一个必须禁用。

您应该这样做：

var clicking=0;
$(document).ready(function(){
 $('button').click(function(){
 clicking++;
 $(this).toggleClass("active");
  if(clicking==3){
   $('button').click(function(){
   $(this).toggleClass("nothing");
   })
  }
 })
})

var clicking=0;
$(document).ready(function(){
  $('button').click(function(){
    clicking++;
    $(this).toggleClass("active");
    if(clicking==3){
      $('button').each(function(){
        if(!$(this).hasClass("active")){
          $(this).addClass("inactive");
        }
      });
    }
  });
});

---

我没有试过，但我想你喜欢类似的东西。

我的建议是使用数组，这样你就知道巫婆按钮被点击了

$(document).ready(function(){
    var clickedbuttons = [];
     $('button').click(function(){
         $(this).toggleClass("active");
         var idx = jQuery.inArray($(this).attr("id"), clickedbuttons );
         if(idx == -1)
             clickedbuttons.push($(this).attr("id"));
         else clickedbuttons.splice(idx,1);
         if(clickedbuttons.length == 3) {
                 $('button').each(function() {
                     var index = jQuery.inArray($(this).attr("id"), clickedbuttons );
                     if(index == -1)
                         $(this).attr("disabled", "disabled");
                 });
             }
             else {
                 $('button').each(function() {
                     $(this).removeAttr("disabled");
                 });
            }
     });
})

我假设每个按钮都有一个id。这将根据您的需要工作，但您必须在每个按钮中都有一个id

如果不想重新启用，请相应地进行更改

$(document).ready(function(){
    var clickedbuttons = [];
     $('button').click(function() {
         var idx = jQuery.inArray($(this).attr("id"), clickedbuttons );
         if(idx == -1) {
             clickedbuttons.push($(this).attr("id"));
             $(this).toggleClass("active");
         }
         if(clickedbuttons.length == 3) {
                 $('button').each(function() {
                     var index = jQuery.inArray($(this).attr("id"), clickedbuttons );
                     if(index == -1)
                         $(this).attr("disabled", "disabled");
                 });
             }
             else {
                 $('button').each(function() {
                     $(this).removeAttr("disabled");
                 });
            }
     });
})

---

好吧，我不是jquery的大师，但我提出了一个简单的逻辑来实现您想要实现的目标，即禁用所有其他在三次单击后未单击的按钮。这是我的工作代码：

var count = 0;
var ids = new Array();
$(document).ready(function(){
 $('button').click(function(){
     ids[count] = this.id;
     count++;    
     if(count == 3){  //three buttons clicked, now time to disable the remaining buttons
         for(var i=0; i<$('button').length; i++){ //we'll check for all buttons
             var id = $('button')[i].id; 
             var flag = true;
             for(var j=0; j<ids.length; j++){ //checking all the buttons against the buttons that got clicked
                 if(id == ids[j])
                     flag = false; //button has been clicked (won't be disabled)              
             }
             if(flag){
                 $("#"+id).attr("disabled", true); //disabling button
             }
         }
     }
 })
})

这是非常不言自明的，我添加了很多评论，但我所做的仍然是：

保存已单击按钮的ID，然后在单击三次后，禁用所有ID与已保存ID不匹配的按钮。很简单。。但是我相信你可以把代码做得更好，因为我不太擅长jquery

---

编辑：缩短代码

我想这就是你想要的？计算具有.active的按钮数。如果是三个或更多，请禁用所有没有.active的按钮

JS:

---

这里有一个。

单击时，首先从所有按钮中删除活动类，然后使用$this将类添加到当前按钮您的问题不清楚，如果单击了三个按钮，则应禁用其余两个按钮？该按钮未激活该类。我将其添加为dinamicalyIt不会提供所需的行为，单击几下后，它将启用禁用的按钮。在发布答案之前，您应该检查您的解决方案。此答案非常完整，我将尽快尝试：Dit有效。我忘记了not属性非常感谢：D