Knockout JS单选按钮点击事件重置选择

Question

我已经在一个单选按钮列表上绑定了“checked”和“click”事件。但是每当单选按钮被点击时，选择不会保留。我一定做错了什么。如果您能指出正确的方向，我将非常感激。

请查看这里的Fiddle

视图模型：

var viewModel = {
    wantsSpam: ko.observable(true),
    spamFlavor: ko.observable('cherry'),

    click: function(model){
        console.log(model);
    }
};

查看：

<input type="radio" name="flavorGroup" value="cherry" 
       data-bind="checked: spamFlavor, click:click" />

- RasikaSam

Answer 1

来自click事件文档：

默认情况下，Knockout会阻止click事件触发任何默认操作。
...
然而，如果您确实希望让默认的click操作继续进行，只需从您的点击处理程序函数中返回true。

所以你的单选按钮被重置了，因为你的click处理程序，要修复它，你只需要在末尾return true即可：

click: function(){
   alert('Hi');
   return true;
}

演示 JSFiddle。

- nemesv

---

谢谢！这意味着很多 :) - Chirag Patel

Answer 2

基本上，您的点击处理程序不会捕获您想要保留的值。

发生的情况是，在选择项目后，它会返回默认值。

只需尝试：

return true;

作为您的处理程序中唯一的代码。

试试吧：http://jsfiddle.net/SinisterSystems/jhHkD/4/

- Nicholas Hazel

---

谢谢Nicholas，你的回答是正确的，但我接受了@nemesv的答案，因为它在顶部。:( - RasikaSam

没问题 :-) 谢谢你的 +10 ;-) - Nicholas Hazel

Answer 3

您只需要删除点击事件或从点击事件中使用return true。因为Knockout会阻止点击事件执行默认操作。这意味着，如果您在a标签（链接）上使用click绑定，浏览器仅会调用您的处理函数，而不会导航到链接的href。

var viewModel = {
    wantsSpam: ko.observable(true),
    spamFlavor: ko.observable('cherry'),
    /*click: function(){
      alert('Hi');
    }*/
};

或者

var viewModel = {
    wantsSpam: ko.observable(true),
    spamFlavor: ko.observable('cherry'),
    click: function(){
      alert('Hi');
      return true;
    }
};

- Linga

---

感谢Ling.s，从点击事件中返回true解决了问题。我接受了@nemesv的答案。 - RasikaSam