使用CSS类禁用DIV内的所有表单字段[重复]答案

【问题标题】：Set all form fields inside DIV disabled using CSS class [duplicate]使用CSS类禁用DIV内的所有表单字段[重复]
【发布时间】：2015-03-31 16:51:31
【问题描述】：

我的页面上有多个div 容器，其中内部有表单字段。它们都具有相同的class 值，我希望使用此类/CSS 将 表单字段 全部设置为非活动状态 (disabled)。

这可能吗？

【问题讨论】：

标签： html css webforms

【解决方案1】：

使用 CSS 有很多方法可以做到这一点，但它们都不是真正有效的，用户可以通过简单的方法绕过仅使用 CSS 的方法。然而，这里是一个使用 css 的示例：

您的 HTML：

<div id="con">
    <input name="name" type="text" value="Text input" />
    <span id="overlay"></span>
</div>

你的 CSS：

#con {
    width: 300px;
    height: 50px;
    position: relative;
}
#con input[type="text"] {
    position: relative;
    top: 15px;
    z-index: 1;
    width: 200px;
    display: block;
    margin: 0 auto;
}
#con #overlay {
    width: 300px;
    height: 50px;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 2;
    background: rgba(155,0,0, .5);
}

Example fiddle

如前所述，jQuery 将是解决这个特定问题的更可靠的解决方案。

【讨论】：

【解决方案2】：

仅使用 CSS 是不可能的。

信息：Disable html input element by applying custom css class

【讨论】：