如何启用\禁用表的所有子控件？答案

【问题标题】：How can I Enable\Disable all subcontrols of a table?如何启用\禁用表的所有子控件？
【发布时间】：2009-05-05 17:10:54
【问题描述】：

我有一个复选框，当它被选中时我想启用一个表及其子控件，当它被禁用时我想做相反的事情。

我已经明白我必须迭代表的所有子控件，我的问题是是否有任何好的通用方法。

提前致谢，

盎司。

【问题讨论】：

标签： c# javascript

【解决方案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;        
}

【讨论】：

如何迭代主表中的子表？他们没有标签名
你打算使用纯javascript还是jQuery？您能否发布您的 HTML，以便我更好地了解您的目标是什么？
对于 jQuery 方式，只需添加 $("#myTable table') 的选择，这将获取表中具有 ID 的所有子表。对于普通的旧 javascript，myTable.getElementsByTagName( "table") 也会这样做。

【解决方案2】：

例如，使用框架（使用 Prototype.js）来处理选择器和类名要容易得多。

单击此项目时，启用所有具有“mycontrols”类的项目。

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

【讨论】：