我有一个带有CssClass =“ mandatory”的radTextBox。
在jQuery中,我有另一件事:
$(".mandatory").focusout( function () {
if($(this).val() == "") $(this).css("border", "1px solid #ff0000");
});
问题是在焦点输出时,默认情况下控件在不同事件上具有的类会“覆盖”我的样式。
我也在jQuery中尝试了下一件事情:
$(".mandatory").focusout( function () {
if($(this).val() == "") $(this).addClass("mandatoryErr");
});
但是仍然没有,在添加该类后立即将其删除。
那么如何使用jQuery向Teleriks控件添加样式?
最佳答案
完成此操作的最简单方法是使用RadTextBox的Client-side API挂接到客户机上的各种样式选项。这是一个代码段,该代码段实际上使用了您的初始代码并将其应用于RadTextBox API:
<script type="text/javascript">
function ChangeBorder () {
var textBox = $find("<%= RadTextBox1.ClientID %>");
if (textBox.get_value() == "") {
textBox.get_styles().EnabledStyle[0] += "border-color: #ff0000";
textBox.updateCssClass();
}
else {
//revert back to old CSS
}
}
</script>
<telerik:RadTextBox ID="RadTextBox1" runat="server" ClientEvents-OnBlur="ChangeBorder">
</telerik:RadTextBox>
要摆脱这一点的重要事项是我们正在订阅RadTextBox(OnBlur)的客户端事件。然后,我们访问RadTextBox客户端对象,检查值是否为“”,然后访问RadTextBox对象的样式。有several different styles,但似乎您在寻找EnabledStyle。要直接应用一些CSS,只需使用样式数组的第一个元素。或者,您可以应用CSSClass:
textBox.get_styles().EnabledStyle[1] += " mandatoryErr";
您将在哪里访问styles数组中的第二个元素。在这里,您可以使managementErr为(例如):
<style>
.mandatoryErr
{
border-color: #ff0000 !important;
}
</style>
!important
标记仅用于提高CSS规则的特异性,否则将不会应用(如果您使用内置样式)。如果您正在寻找有关所有这些的更多信息,则链接的文档文章会有所帮助。您还可以使用Chrome开发工具和FireBug检查上方的
textBox
变量,并查看_styles
属性的内容:)