Javascript 使用Knockout通过click事件从JSON更新视图

我正试图在每次使用敲除触发事件（例如，按钮单击）时更新视图模型。单击红色按钮时，应显示“红花”。单击蓝色时，应将其更改为“蓝天”

基本上，我只想单击一个按钮，用适当的数据更新视图。我觉得我很接近。我遗漏了什么，如何使用

$.getJSON

扩展此逻辑

小提琴：

HTML: 你可以试试：

$('.red').click(function() {
  var viewModel = ko.mapping.fromJS(data.colors[0]);
  ko.cleanNode(document);
  ko.applyBindings(viewModel);
});

$('.blue').click(function() {
  var viewModel = ko.mapping.fromJS(data.colors[1]);
  ko.cleanNode(document);
  ko.applyBindings(viewModel);
});

---

它可以工作，但不是推荐使用knockout的方法。

您能澄清您想要做什么或修复您的JSFIDLE示例吗？目前没有做任何事情啊，对不起，让我重新回答这个问题。给我一点时间！非常感谢。你的方法确实管用，但如果我可以问一下，推荐的方法是什么？我对正确地执行此操作感兴趣，似乎您在引用observates（），因此我只绑定一次视图。我将如何实现同样的目标？也许我应该开始另一个问题…所有内容都应该在viewModel以及您的单击处理程序中。例如，您的视图模型应该是这样的：var viewModel={colors:ko.observearray（[]），selectedColor:ko.observeable（），setColor:function（colorName）{/*…*/}；最好不要使用jQuery，但毕竟代码工作正常。

var data = {
  "colors": [{
    "name": "blue",
    "things": [{
      "item1": "sky",
      "item2": "ocean",
    }, ]
  }, {
    "name": "red",
    "things": [{
      "item1": "flower",
      "item2": "sun",
    }, ]
  }, ]
};

$('.red').click(function() {
  var viewModel = ko.mapping.fromJS(data.colors[0]);
});

$('.blue').click(function() {
  var viewModel = ko.mapping.fromJS(data.colors[1]);
});

$('.red').click(function() {
  var viewModel = ko.mapping.fromJS(data.colors[0]);
  ko.cleanNode(document);
  ko.applyBindings(viewModel);
});

$('.blue').click(function() {
  var viewModel = ko.mapping.fromJS(data.colors[1]);
  ko.cleanNode(document);
  ko.applyBindings(viewModel);
});