我有一个带有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属性的内容:)

10-05 20:30
查看更多