1

我正在使用 .NET 中的表单并使用标准字段验证器。如果用户单击“提交”按钮而不填写必填字段（requiredfieldvalidator标签变为可见），我想要的是使输入字段更改背景颜色。

我通过requiredfieldvalidator在输入字段之前添加一个来做到这一点。当用户单击“提交”按钮时，验证器从display:none变为display:inline。但我感兴趣的是在输入字段上设置不同的背景颜色，所以我做了这样的事情：

CSS

.error[style*="inline"] + input { background-color: #e8bab2; }

HTML

<span  class="error" style="display:none;"></span>
<input type="text">
<input type="button" id="sendme" value="Send" />

JS（验证器处理这部分）

$(function() {
    $("#sendme").click(function() {
        $(".error").css("display","inline");
    });
});

问题是当我单击按钮时，该字段在 Firefox 中会亮起红色，但在 Webkit（Chrome 19/Safari 5.1）中，输入字段在我单击输入字段之前不会改变背景颜色。

我创建了一个小提琴，比较 Firefox 和 Webkit 浏览器之间的行为。

（注：删除所有 JS 逻辑，使其更“干净”）

4

3 回答 3

0

Try this:

$(function() {  
    $("#sendme").click(function() {  
        $(".error").css("display","inline");  
        $('.error[style*="inline"] + input').css("background-color","#e8bab2");  
    });
});​

Demo: http://jsfiddle.net/fhbUH/3/

于 2012-06-19T08:22:15.500 回答
0

Some browsers are failing - not only the one you tested. If I were you I'd change the class of the input - jQuery has methods for this. (addclass,removeclass)

于 2012-06-19T08:23:50.150 回答
0

它发生了！请检查一下：

铬合金

于 2012-06-19T08:17:57.547 回答