Question

我有一个页面布局，其中包含许多用于编辑的输入字段。问题是，当“更新按钮”处于活动状态时，我必须禁用所有这些按钮（以及其他按钮），即用户已编辑某些内容并按下更新，所有内容都被禁用，因此用户无法进行任何其他更改，直到请求已经完成了。

如何捕获活动按钮并禁用页面的其余部分（使用JS并且可能是jQuery）？附：我宁愿不放任何代码因为它很大。只是寻找这个特定问题的提示。

提前致谢。

Answer 1

我们去^^

＆＃13;

$("#disable").click(function(){
  $(".toDisable").prop('disabled', true);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/><input type="text" class="toDisable"/>
<input type="button" id="disable" value="Disable everything">

＆＃13;

Answer 2

检查更新按钮是否处于活动状态，如果是，则对所有输入字段执行以下操作

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

Answer 3

＆＃13;

$(document).ready(function() {
  $( "form" ).submit(function( event ) {
    $("input.text").attr('disabled', true);
  });

  //$("input.text").removeAttr('disabled');
});

＆＃13;

input {
  display: block;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<form action="javascript:alert( 'success!' );">
  <input type="text" class="text" />
  <input type="text" class="text" />
  <input type="text" class="text" />
  <input type="text" class="text" />

  <input type="submit" value="Update" class="update" />
</form>

＆＃13;

检查一下。

当按钮处于活动状态时禁用所有输入

3 个答案: