单击 reject/close 后禁用两个按钮

Question

我的任务是能够在单击拒绝按钮后禁用批准和 return 按钮。拒绝按钮意味着关闭一个项目。这些是我的代码。谁能帮我弄清楚如何禁用按钮？this is what the button looks like.

<div class="text-center ">
    <button class="btn m-1 align-items-center btn-success text-center " id="approve">Approve</button>   
    <button class="btn btn-danger m-1 align-items-center text-center " id="clear" onclick="sweetalertrejects()">Reject</button>
    <button class="btn btn-secondary m-1 align-items-center text-center" id="return">Return</button>       
    </div>
    </div>
    </div>
                        <script>
                        function sweetalertrejects(){
                            swal("This button means closing the task. You will not be able to revert this action. Do you wish to continue?", {
                                icon: "info",
                                  buttons: {
                                    cancel: "Cancel",
                                    catch: {
                                      text: "Yes, close this task",
                                      value: "cancel",
                                    },
                                    
                                  },
                                })
                                .then((value) => {
                                  switch (value) {
                                 
                                
                                    case "cancel":
                                      swal("Closed!", "Task has been closed.", "success");
                                      break;
                                 
                                    default:
                                      swal("Task has not been closed.");
                                  }
                                });

                        }
                        </script>

Answer 1

您可以通过id获取按钮并禁用它们，如下所示：

document.getElementById("approve").disabled = true;
document.getElementById("return").disabled = true;

这是完整的代码

function sweetalertrejects(){
swal("This button means closing the task. You will not be able to revert this action. Do you wish to continue?", {
  icon: "info",
  buttons: {
    cancel: "Cancel",
    catch: {
      text: "Yes, close this task",
      value: "cancel",
    },

  },
})
  .then((value) => {
  switch (value) {


    case "cancel":
      swal("Closed!", "Task has been closed.", "success").then(()=>{
      document.getElementById("approve").disabled = true;
      document.getElementById("return").disabled = true;

      });
      break;

    default:
      swal("Task has not been closed.");
  }
});
}

Answer 2

您需要在批准和 Return 按钮中包含类名“禁用”，您的 javascript 代码应如下所示：

<script>
$('#clear').click(function() {

    swal("This button means closing the task. You will not be able to revert this action. Do you wish to continue?", {   
    icon: "info",
        buttons: {
        cancel: "Cancel",
        catch: {
            text: "Yes, close this task",
            value: "cancel",
        },
        
        },
    })
    .then((value) => {
        if(value){
            $('.disable').attr('disabled','disabled');
            swal("Closed!", "Task has been closed.", "success");
        }else{
            swal("Task has not been closed.");
        }
    });

});
</script>

单击 reject/close 后禁用两个按钮

disable two buttons after clicking reject/close

javascript

button

sweetalert

disable