如何啟用\\禁用表的所有子控件？

Question

我有一個checkBox，當它被檢查時，我想啟用一個表及其子控件，當它被禁用時，我想做相反的事情。

我已經明白我必須迭代表的所有子控件，我的問題是，是否有任何好的和通用的方法。

提前致謝，

盎司

Answer 1

你可以用jQuery做到這一點。 假設你的HTML看起來像這樣：

<input type="checkbox" onclick="toggleControls(this)"/>Controls Disabled
<table id="myTable">
 <tr>
  <td>Name: <input type="text" /></td>
  <td>Select: <input type="radio" /></td>
 </tr> .....

toggleControls（）函數用於禁用/啟用表中的所有控件 （ 這意味着所有文本框，按鈕，復選框，單選按鈕和下拉列表 ）如下所示：

<script>
   function toggleControls(e){
     $('#myTable input,select,textarea').attr('disabled',e.checked);
   }
</script>

jQuery的css選擇器使一行禁用/啟用控件。 使用普通的舊javascript，函數將如下所示：

var myTable = document.getElementById("myTable");
var controls= myTable.getElementsByTagName("input"); 
// Repeat the previous line for "select" and "textarea"
for(i = 0; i < controls.length; i++) {
    control = controls[i];
    control.disabled = !control.disabled;        
}

Answer 2

使用框架（例如使用Prototype.js）使用選擇器和類名更容易。

單擊此項目時，啟用“mycontrols”類的所有項目。

$('containerDiv').select('.mycontrols').each(function(element){element.disabled=false})