jquery - 在运行时更改 KendoPanel 的颜色

标签 jquery html css kendo-ui kendo-panelbar

我正在使用 KendoPenel 来显示一些数据,并希望在数据运行时展开特定面板并更改其颜色,但存在一些问题。

我可以选择面板并使用以下代码展开它:

 function ExpandItemInPanelBar() {
        var panelBar = $("#KendoPanel3").data("kendoPanelBar");
        // I have set 0 in 'eq(0)' so it will expand first item you can change it as per your code
        panelBar.select(panelBar.element.children("li").eq(2));

        var item = panelBar.select();          
        panelBar.expand(item);
        item.addClass('myClass')   

    }

   .myClass
{
    background-color: red;
}

然而,尽管 item.addClass('myClass') 似乎生效了,因为当我在调试器中将鼠标悬停在 item 元素上时,它有类“MyClass added”,但听起来好像没有正确更改背景颜色。我是否需要执行任何特殊操作才能使该特定更改生效?

最佳答案

http://dojo.telerik.com/@Stephen/IXEfe

您需要使样式上的选择器更具体,以便它覆盖所有其他背景颜色规则,并且此选择器将取决于 Pane 的内容。

在我的示例中,我制作了样式选择器

ul.k-panelbar > li.myClass > div
{
  background-color: red; 
}

如果您只将样式添加到 li 元素(您的“元素”),则不会覆盖构成内容的 div 的背景。通过增加样式规则的特异性,它将覆盖其他样式。

关于jquery - 在运行时更改 KendoPanel 的颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39714639/

相关文章:

javascript - 防止加载无限循环

javascript - 解析输出和样式 xml 数据

javascript - jQuery 切换在我的页面中不起作用

javascript - 如何在php中调用具有相同div名称的脚本函数?

html - 对齐图像标题

jquery - 如何获取选择菜单的数据属性

javascript - 为什么<label>中的<button>会触发点击两次?

jquery - 如何在克隆字段集 jQuery 中克隆字段集

css - CSS 中 calc() 的最大可用数字是多少?

css - 帮助页面样式