引导禁用按钮不保留

Question

我想要做的是一旦单击按钮，禁用它，然后运行一个功能，然后一旦完成运行该功能，重新启用按钮，我正在尝试这个，但按钮只禁用一秒钟，然后在函数运行完成之前重新启用：

<button onclick='this.disabled=true;stop($vpsid)' type='button' class='btn btn-danger btn-sm'>Stop</button>

停止功能：

function stop(vpsid){
   $.post('functions.php', {"func":"shutdown", "vpsid":vpsid}, function(data) {
 alert(data);});
}

Answer 1

AJAX 调用是异步的，因此您需要使用回调函数。我建议你使用 jQuery 来附加点击处理程序并使用 Bootstrap 的按钮加载状态：

HTML

<button data-vpsid='$vpsid' type='button' data-loading-text='Stopping...' class='btn btn-danger btn-sm btn-stop'>Stop</button>

jQuery

$('.btn-stop').click(function () {
    $(this).button('loading');
    $.ajax('functions.php', {
        data: {
            "func": "shutdown",
            "vpsid": $(this).data('vpsid')
        },
        type: 'post',
        complete: function () {
            $(this).button('reset');
        },
        success: function (data) {
            alert(data);
        }
    });
});