本文介绍如何利用JavaScript循环获取页面中的input、select和textarea元素,并通过设置disabled属性为true来统一禁用所有文本框、下拉菜单及多行文本域,适用于需要限制用户输入的场景。
JavaScript禁用表单控件的实现原理与代码
核心思路是遍历网页中所有的表单控件,并将它们的disabled属性设置为true。
具体实现代码如下:
代码示例如下:
<script type="text/javascript">
var nodeList = document.getElementsByTagName("input");
for (var i = 0; i < nodeList.length; i++) {
nodeList[i].disabled = true;
}
nodeList = document.getElementsByTagName("select");
for (var i = 0; i < nodeList.length; i++) {
nodeList[i].disabled = true;
}
nodeList = document.getElementsByTagName("textarea");
for (var i = 0; i < nodeList.length; i++) {
nodeList[i].disabled = true;
}
</script>以下是上述控件对应的type属性值:
可通过document.getElementsByName("controlName")[0].type.toLocaleLowerCase()获取控件类型。
不同控件的type属性值包括: "text" "textarea" "select-one" "select-multiple" "radio" "checkbox"