我正在使用 jQuery 验证插件来验证我的 .net Web 表单 asp 文本字段。验证效果很好,但我想要通过在字段无效后更改 asp 文本框边框颜色来进行更多验证。我看到很多 Material 都涉及设置错误消息的颜色,但不是文本框字段的颜色。有些技能在 .Net 上并不能很好地发挥作用。有人知道如何使用 JQuery 验证插件来实现这一点吗?
我当前的代码如下:
ASPX页面
<asp:Label ID="lblEmail" runat="server" Text="Your Email" class="QueryLabel"></asp:Label>
<asp:TextBox ID="txtEmail" runat="server" name="txtEmail" class="QueryBox" ClientIDMode="Static" ></asp:TextBox><br /><br />
<asp:Label ID="lblFirstName" runat="server" Text="First Name" class="QueryLabel"></asp:Label>
<asp:TextBox ID="txtFirstName" runat="server" name="txtFirstName" class="QueryBox" ClientIDMode="Static" ></asp:TextBox> <br /><br />
<asp:Label ID="lblLastName" runat="server" Text="Last Name" class="QueryLabel"></asp:Label>
<asp:TextBox ID="txtLastName" runat="server" name="txtLastName" class="QueryBox" ClientIDMode="Static"></asp:TextBox> <br /><br />
jS
$(document).ready(function(){
$("#form1").validate({
rules: {
<%=txtEmail.UniqueID %>: {
required: true,
email: true
},
<%=txtFirstName.UniqueID %>: {
required: true,
},
<%=txtLastName.UniqueID %>: {
required: true,
},
}, messages: {},
errorClass: "error-class",
validClass:"valid_class",
errorElement: "em",
success: function(label) {
label.addClass("valid_class").append('✔')
},
});
});
CSS 文件
.error-class {
color:#ff0000;
}
.valid_class {
color:#032d3a;
}
最佳答案
只需添加以下CSS:
.error-class.QueryBox {
border-color: red;
}
关于JQuery 验证插件 - 更改 asp 文本框的边框颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42263723/