为什么我的Knockout Radio按钮在使用单击绑定的另一个元素内失败?

时间:2013-08-29 21:34:17

标签: javascript html knockout.js

我有一个单选按钮列表。我想点击<li>他们的内容也检查单选按钮。这一切都有效,直到我在无线电元素上放置name属性。然后我的代码停止工作。

以下是我的代码:

<ul data-bind="foreach: rows">
    <li data-bind="click: function() { $parent.val($data); }">
        <input type="radio" name="my_radio" data-bind="value: $data, checked: $parent.val" />
        <label data-bind="text: $data"></label>
    </li>
</ul>

以下是两个测试用例。

请务必单击单选按钮和行。

工作: http://jsfiddle.net/Dihedral/HJGxX/2/

不工作: http://jsfiddle.net/Dihedral/HJGxX/3/

在第二种情况下,当只点击收音机时,您会看到val()observable正在更新,但UI却没有。任何人都知道这里发生了什么,或者能看到解决方法吗?

2 个答案:

答案 0 :(得分:5)

点击未到达单选按钮,因为knockoutjs从点击处理程序返回false,阻止默认操作发生(请参阅:note 3)。只需从点击处理程序(http://jsfiddle.net/HJGxX/4/)返回true:

<li data-bind="click: function() { $parent.val($data); return true; }">

答案 1 :(得分:0)

将name属性设置为相同的值会使所有这些单选按钮成为同一组的一部分,并且您只能一次选择其中一个。

详细了解www.W3.org

上的单选按钮名称属性