css - css填满时如何更改表单中字段的颜色？

Question

我需要这样的形式：

因此，当字段已满时，我想要颜色：蓝色；

如何用 css 编写代码。

必须是这样的：

.formfield:?? {
color: blue;
}

标签： css

Answer 1

您可以onkeyup="this.setAttribute('value', this.value);"在 css 中使用 and.formfield:not([value=""])并设置border-colornotcolor

.formfield:not([value=""]) {
    border-color: blue;
}

<input value="" class="formfield" onkeyup="this.setAttribute('value', this.value);"/>

如果您将验证设置为输入，例如required

.formfield:valid { border-color: blue; }

<input class="formfield" required>