0
我正在尝试做一些非常简单直接的事情。我想单击一个（class =“AccentSquares”），将其制作成彩色方块。每个方块的颜色对应不同的主题颜色。顶部的栏（class =“MobileNewAccountHeader”），默认为“紫色”，应该更改为我点击的正方形的颜色。这是我的。Kendo MVVM异步背景颜色绑定
HTML
<div id="UserAccentColor">
<div class="MobileNewAccountHeader" style="margin-bottom: 0" data-bind="style: { backgroundColor: themecolor }">Accent Color</div>
<div class="HeaderBarWhite">
<div class="Cancel" data-bind="click: cancel">Cancel</div>
<div class="Save" data-bind="click: save">Save</div>
</div>
<div class="PasswordFont" style="padding: 10px;">
Select from the six colors below to set your accounts theme color.
</div>
<div style="margin-top: 10px; width: 89.8%; margin-left: 5%">
<div class="AccentSquares" data-bind="click: change1, style: { backgroundColor: color1 }"></div>
<div class="AccentSquares" data-bind="click: change2, style: { backgroundColor: color2 }"></div>
<div class="AccentSquares" data-bind="click: change3, style: { backgroundColor: color3 }"></div>
<div class="AccentSquares" data-bind="click: change4, style: { backgroundColor: color4 }"></div>
<div class="AccentSquares" data-bind="click: change5, style: { backgroundColor: color5 }"></div>
<div class="AccentSquares" data-bind="click: change6, style: { backgroundColor: color6 }"></div>
</div>
Jquery的
var newaccountcolorvm = kendo.observable({
themecolor: "purple",
color1: "purple",
color2: "greenyellow",
color3: "green",
color4: "yellow",
color5: "pink",
color6: "orange",
chang1: function() {
this.set("themecolor", "purple");
},
chang2: function() {
this.set("themecolor", color2);
},
chang3: function() {
this.set("themecolor", "green");
},
chang4: function() {
this.set("themecolor", "yellow");
},
chang5: function() {
this.set("themecolor", "pink");
},
chang6: function() {
this.set("themecolor", "orange");
},
cancel: function() {
pageNav("#FirstTimeUserSettings");
},
save: function() {
pageNav("#FirstTimeUserSettings");
}
}）;在您的div