JavaScript实现禁用网页所有表单控件

作者:小括号

时间:2026-10-27

浏览:365

本文介绍如何利用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"

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章