使用 CSS class 禁用 DIV 内的所有表单域

Question

我的页面上有几个 div 容器 inside。它们都具有相同的 class 值，我希望使用此 class/CSS.[=16= 设置 表单字段 全部处于非活动状态 (disabled) ]

这可能吗？

Answer 1

仅 CSS 这是不可能的。

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

Answer 2

有一些方法可以用 CSS 做到这一点，但是其中 none 实际上是有效的，用户可以通过简单的方法绕过 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 将是解决此特定问题的更可靠的解决方案。

使用 CSS class 禁用 DIV 内的所有表单域

Set all form fields inside DIV disabled using CSS class

html

css

webforms