如何在单击其中一个提交按钮时禁用两个提交按钮

Question

我的 cshtml 文件中有两个提交按钮。<button type="submit" name="SubmitButton" value="accept" id="buttonAccept">Accept</button> <button type="submit" name="SubmitButton" value="refuse" id="buttonRefuse"Refuse</button>我试图在单击这两个按钮之一时禁用它们。有办法这样做吗？

Answer 1

你可以使用javascript（尤其是jQuery）来达到你的目的。

但是，实际上，当您提交表单时，这意味着您的表单已发送到服务器并返回视图的新结果，因此接下来的步骤将在后端发生，您的后端将负责以您的方式呈现结果想。

$('#buttonAccept').on("click",function() {

  $('#buttonRefuse').attr("disabled", "disabled");

});

$('#buttonRefuse').on("click",function() {

  $('#buttonAccept').attr("disabled", "disabled");

});

Answer 2

这应该可以做到：

document.getElementsByName("SubmitButton")[0].disabled = true;
document.getElementsByName("SubmitButton")[1].disabled = true;

但我不会直接使用索引。

Answer 3

jquery如果您的页面没有，请先添加

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">

然后像这样添加点击事件

<button type="submit" name="SubmitButton" value="accept" id="buttonAccept" onclick="EnableDisable()">Accept</button>  

<button type="submit" name="SubmitButton" value="refuse" id="buttonRefuse" onclick="EnableDisable()">Refuse</button>

然后你可以像这样禁用submit button其中任何一个click event

function EnableDisable() {

  $(':input[type="submit"]').prop('disabled', true);

}

Answer 4

您可以对这两个按钮使用类似的代码。onClick在一个按钮上禁用另一个按钮，依此类推。

<button type="submit" name="SubmitButton" value="accept" id="buttonAccept" onclick="return foo();">Accept</button>

function foo() {

   document.getElementById("buttonAccept").disabled = true;

   document.getElementById("buttonRefuse").disabled = true;

   return true;

}