3

我必须更改 javascript 中某些控件的背景颜色。我找到了 DropDownList 和 ComboBox 的方法，但我找不到任何关于 DatePicker 的信息？奇怪的是，没有标准的方法可以做到这一点，因为似乎没有控制可以让您访问相同的元素。例如，要在下拉列表中做我想做的事，我访问“span”：

$("#myDropDown").data("kendoDropDownList").span.css("background-color", "#BDD1FF");

使用组合框时，您可以访问“输入”元素：

$("#myComboBox").data("kendoComboBox").input.css("background-color", "#BDD1FF");

然而，这些都不适用于 kendoDatePicker。有人知道路吗？我尝试直接访问 css（如在 JQuery 中）但没有运气。

编辑：我只需要更改表单中的几个控件，而不是全部。这就是为什么我不能覆盖剑道 CSS。仅当我的视图模型处于编辑模式时，我还需要应用此背景。因此，我需要能够切换类，这就是我在考虑 JavaScript 的原因。

4

2 回答 2

7

最简单的方法是定义自己的 CSS 来应用颜色。您可以在单个命令中执行以下操作：

.k-input {
    background: #BDD1FF !important;
}

然后使用它你不需要做任何特别的事情，只需：

$("#myKendoDropDown").kendoDropDownList().data("kendoDropDownList");
$("#myComboBox").kendoComboBox({}).data("kendoComboBox");
$("#myDate").kendoDatePicker({});

重要的是要注意几个问题：

  1. 您不能简单地定义background-color，因为 KendoUI 还使用背景图像和其他背景属性，因此您需要将它们全部覆盖。
  2. !important实际上很重要，因为您想覆盖 background.

这里的例子：http: //jsfiddle.net/OnaBai/Nxv3B/

编辑：如果您想以编程方式进行操作，以便控制哪些元素，那么您应该这样做。

var dd1 = $("#myKendoDropDown1").kendoDropDownList().data("kendoDropDownList");

用于创建小部件，然后应用样式：

dd1.wrapper.find(".k-input").css("background", "#BDD1FF");

请参阅此处的小提琴修饰符：http: //jsfiddle.net/OnaBai/Nxv3B/5/

于 2013-09-19T00:34:08.317 回答
0

与其尝试以上述方式进行操作，不如担心它是 Kendo DropDownList。问题是，大多数时候在 Document.Ready 中，小部件还没有准备好。因此，只需将其视为页面上的普通元素，直到它加载为止。这将为您节省大量时间。 

$("#myKendoDropDown1").css("width", 220);

这不是这篇文章的正确答案，因为这个解决方案不适用于背景色，但它适用于其他 CSS。

于 2014-06-11T20:58:26.920 回答