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

Why are my Knockout Radio buttons failing when inside another element with a click binding?

本文关键字：元素 另一个 失败 绑定 单击 Radio Knockout 我的 按钮 为什么      更新时间：2023-09-26

我有一个单选按钮列表。我想点击他们的<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没有。有人知道这里发生了什么，或者能找到解决办法吗？

点击没有到达单选按钮，因为knockoutjs从点击处理程序返回false，从而阻止了默认操作的发生（请参见：注释3）。只需从单击处理程序返回true(http://jsfiddle.net/HJGxX/4/)：

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

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

有关单选按钮名称属性的更多信息，请访问www.W3.org

相关文章：