disabled属性用于禁用表单元素,使其不可操作且提交时不发送值;可通过HTML直接添加或JavaScript动态控制;与readonly不同,disabled使元素完全不可用且不提交数据,而readonly仅限制编辑但保留值提交。
在HTML表单中,disabled 是一个常用的布尔属性,用于禁用表单元素,使其无法被用户操作。被禁用的元素不会响应点击、输入等交互行为,并且在表单提交时,其值不会被发送到服务器。
给表单元素添加 disabled 属性后,会产生以下效果:
可以直接在HTML标签中添加 disabled 属性,无需赋值(布尔属性):
也可以通过JavaScript动态控制:
document.getElementById("myInput").disabled = true; document.getElementById("myInput").disabled = false;例如,根据复选框状态启用/禁用输入框:
function toggleInput() { const checkbox = document.getElementById("agree"); const input = document.getElementById("nameInput"); input.disabled = !checkbox.checked; }disabled 和 readonly 都能限制用户输入,但有关键区别:
基本上就这些。合理使用 disabled 属性,能有效提升表单的交互逻辑和用户体验。注意在服务端也要做对应校验
,因为前端禁用可被绕过。