當按鈕處於活動狀態時禁用所有輸入

Question

我有一個帶有大量輸入字段的窗體的頁面佈局以進行編輯。問題是，當'更新按鈕'處於活動狀態時，我必須禁用所有這些按鈕（以及其他按鈕），即用戶已編輯某些內容並按下更新並且所有內容都被禁用，因此用戶在請求之前不能進行任何其他更改做完了。

如何捕獲活動按鈕並禁用頁面的其餘部分（使用JS和可能是jQuery）？附：我寧願不放任何代碼，因爲它是巨大的。只是爲這個特定問題尋找小費。

在此先感謝。

Answer 1

檢查更新按鈕被激活，如果是，那麼做以下所有輸入字段，

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

Answer 2

在這裏，我們去^^

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

<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">

Answer 3

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

 
    //$("input.text").removeAttr('disabled'); 
 
});

input { 
 
    display: block; 
 
}

<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>

選中此項。