Javascript 按钮需要在工作前点击两次，我希望它只被点击一次

我有一个启用和禁用按钮。单击每个按钮时，控制台中都会返回一条“成功”消息。启用按钮只需单击一次即可工作，但是，禁用按钮需要单击两次，然后才能在my developer tools的控制台中打印“成功”消息。这有什么问题？谁能帮我修一下这个吗？谢谢。这是我的密码：

 <button  class="btn_mode"  value="1">Enable</button>
 <button  class="btn_mode"  value="0">Disable</button>


  <script type="text/javascript">

$(".btn_mode").click(function(){

  var mode_val = $(this).val();
  var postdata={'mode':mode_val};

  $.ajax({

    type:"POST",
    url:"<?php echo base_url();?>superadmin/change_mode",
    dataType:'json',
    data:postdata,
    success: function(data){

         if(data.notify=="Success")
            {
             console.log(data.notify);
             location.reload();
            }
            else{
              console.log(data.notify);

            }

       }
  });

});



</script>

模型

添加

console.log（'Posting mode_val:'+mode_val'）时的输出
单击控制台中的启用按钮输出


单击禁用按钮时控制台中的输出

嗯，也许是这样的

$(".btn_mode[value='1']").on("click", function(){ do something });
$(".btn_mode[value='0']").on("dblclick", function(){ do something });

嗯，也许是这样的

$(".btn_mode[value='1']").on("click", function(){ do something });
$(".btn_mode[value='0']").on("dblclick", function(){ do something });

由于您的事件连接看起来不错，我怀疑服务器端出了问题，这意味着您的成功处理程序没有启动。尝试在ajax调用之前进行日志记录，以查看是否触发了click事件：

$(".btn_mode").click(function(){

  var mode_val = $(this).val();
  var postdata={'mode':mode_val};

  console.log('Posting mode_val: ' + mode_val);

  $.ajax({

    type:"POST",
    url:"<?php echo base_url();?>superadmin/change_mode",
    dataType:'json',
    data:postdata,
    success: function(data){

         if(data.notify=="Success")
            {
             console.log(data.notify);
             location.reload();
            }
            else{
              console.log(data.notify);

            }

       }
  });

});

编辑：
您上传的图像表明服务器端代码有问题，您的按钮点击启动正常。如果您更新php以捕获错误并返回它，您应该能够得到错误的提示。要查看呼叫完成，您可以实现“完成”和/或“错误”回调：

  $.ajax({

    type:"POST",
    url:"<?php echo base_url();?>superadmin/change_mode",
    dataType:'json',
    data:postdata,
    success: function(data){

         if(data.notify=="Success")
            {
             console.log(data.notify);
             location.reload();
            }
            else{
              console.log(data.notify);

            }

       },
    error: function(jqXhr, txtStatus, errThrown){
         console.log('Call failed with status:' + txtStatus);

         if(errThrown)
             console.log('and error:' + errThrown);
       },
    complete: function(jqXhr, txtStatus){   
         console.log('Call completed with status:' + txtStatus);
       }
  });

});

$.ajax({
类型：“POST”，
url:“超级管理员/更改\u模式”，
数据类型：'json'，
数据：postdata，
成功：功能（数据）{
if（data.notify==“成功”）
{
console.log（data.notify）；
location.reload（）；
}
否则{
console.log（data.notify）；
}
},
错误：函数（jqXhr、txtStatus、errhorn）{
log（'调用失败，状态为'+txtStatus'）；
如果（错误抛出）
log（'和错误：'+errrown）；
},
完成：函数（jqXhr，txtStatus）{
log（'调用已完成，状态：'+txtStatus）；
}
});
});
由于您的事件连接看起来不错，我怀疑服务器端出现了问题，这意味着您的成功处理程序没有启动。尝试在ajax调用之前进行日志记录，以查看是否触发了click事件：

$(".btn_mode").click(function(){

  var mode_val = $(this).val();
  var postdata={'mode':mode_val};

  console.log('Posting mode_val: ' + mode_val);

  $.ajax({

    type:"POST",
    url:"<?php echo base_url();?>superadmin/change_mode",
    dataType:'json',
    data:postdata,
    success: function(data){

         if(data.notify=="Success")
            {
             console.log(data.notify);
             location.reload();
            }
            else{
              console.log(data.notify);

            }

       }
  });

});

编辑：
您上传的图像表明服务器端代码有问题，您的按钮点击启动正常。如果您更新php以捕获错误并返回它，您应该能够得到错误的提示。要查看呼叫完成，您可以实现“完成”和/或“错误”回调：

  $.ajax({

    type:"POST",
    url:"<?php echo base_url();?>superadmin/change_mode",
    dataType:'json',
    data:postdata,
    success: function(data){

         if(data.notify=="Success")
            {
             console.log(data.notify);
             location.reload();
            }
            else{
              console.log(data.notify);

            }

       },
    error: function(jqXhr, txtStatus, errThrown){
         console.log('Call failed with status:' + txtStatus);

         if(errThrown)
             console.log('and error:' + errThrown);
       },
    complete: function(jqXhr, txtStatus){   
         console.log('Call completed with status:' + txtStatus);
       }
  });

});

$.ajax({
类型：“POST”，
url:“超级管理员/更改\u模式”，
数据类型：'json'，
数据：postdata，
成功：功能（数据）{
if（data.notify==“成功”）
{
console.log（data.notify）；
location.reload（）；
}
否则{
console.log（data.notify）；
}
},
错误：函数（jqXhr、txtStatus、errhorn）{
log（'调用失败，状态为'+txtStatus'）；
如果（错误抛出）
log（'和错误：'+errrown）；
},
完成：函数（jqXhr，txtStatus）{
log（'调用已完成，状态：'+txtStatus）；
}
});
});
尝试更改模型以返回更新的实际结果。
比如：

取决于更新后db包装返回的内容。
尝试更改模型以返回更新的实际结果。
比如：

取决于数据库包装器在更新后返回的内容。
不带“return false”。。它现在工作了吗？你的PHP脚本做什么了？也许你第一次遇到错误？你初始化的事件将触发两次，因为两个按钮都有相同的类需要为按钮启动单独的事件…我试图更改禁用按钮的类，这样它们就不会有相同的类，但仍然没有working@codebreaker. 什么意思？如果单击一个按钮，它不会启动两次。如果没有“返回false”。。它现在工作了吗？你的PHP脚本做什么了？也许你第一次遇到错误？你初始化的事件将触发两次，因为两个按钮都有相同的类需要为按钮启动单独的事件…我试图更改禁用按钮的类，这样它们就不会有相同的类，但仍然没有working@codebreaker. 什么意思？如果你点击一个按钮，它不会启动两次。我想我们在这里有误解：），我希望禁用按钮只被点击一次，它才能工作，因为现在，它需要被点击两次，然后它才能工作啊，现在我明白了。当您单击“禁用”按钮时，在您再次单击之前，不会发生任何事情。是的，绝对不会。这有什么问题？请帮助是的，但它在仅仅警告值时工作正常，但我的javascript函数会访问codeigniter和echo json_encode的控制器和模型函数，然后打印到控制台，所以它总是在按钮单击时返回警报，在两个按钮上？我想我们在这里有误解：），我想禁用按钮只需点击一次，它就可以工作了，因为现在，它需要点击两次才能工作啊，现在我明白了。当您单击“禁用”按钮时，在您再次单击之前，不会发生任何事情。是的，绝对不会。这有什么问题？请帮助是的，但它在仅警告值时工作正常，但我的javascript函数将访问codeigniter和echo json_encode的控制器和模型函数，然后打印到控制台上。它总是在按钮单击时返回警报，在两个按钮上都返回警报？请查看我添加console.log时上载的图像（'Posting mode_val:'+mode_val）；在js函数中查看我在js函数中添加console.log（'Posting mode_val:'+mode_val'）时上传的图像
return $this->db->update('maintenance_mode',$data);