Question

我想使用jquery或javascript启用和禁用按钮。实际情况是如果我单击启动按钮，则在状态为运行状态时转到php表，如果启动状态为停止状态，则禁用启动按钮；如果启动状态，则需要启用启动按钮。

Answer 1

jQuery('#button-id').attr('disabled', true);
jQuery('#button-id').attr('disabled', false);

您只需要更改禁用的属性值

Answer 2

请通过JQuery使用Ajax。

$('#btn').click(function (e) {

    e.preventDefault()
    let btn = $(this)
    btn_disable(btn)

    $.ajax({
        url: 'your_url',
        method: 'your_method',
        data: {your_data}, //if you haven't data please type {}

        success: function (response) {
            btn_enable(btn)
        },

        error: function (XMLHttpRequest, textStatus, errorThrown) {
            btn_enable(btn)
        },

        complete: function (response) {
            btn_enable(btn)
        }

    })
})

function btn_disable(btn) {
    btn.attr('disabled', 'disabled')
    btn.addClass('disabled')
}

function btn_enable(btn) {
    btn.removeAttr('disabled')
    btn.removeClass('disabled')
}

在这里您可以阅读有关Ajax的更多信息： https://api.jquery.com/jquery.ajax/

Answer 3

请检查以下示例。如果API响应为true，则按钮将被禁用；如果为false，则按钮将被启用

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $.ajax({url: "ur_Api, success: function(result){
    if(result === true){
      $("#btn_status").attr('disabled', true);
      }
      else {
        $("#btn_status").attr('disabled', false);
    }});
  });
});
</script>
</head>
<body>

<div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div>

<button id="btn_status">Status</button>

</body>
</html>

启用和禁用按钮

3 个答案: