Question

我有这个代码显示两个单选按钮，供用户选择是或否。

<fieldset data-role="controlgroup">
    <legend>Choose</legend>
    <input type="radio" name="pref" id="radio1" value="yes" data-bind="checked: $root.selected" />
       <label for="radio1">YES</label>
    <input type="radio" name="pref" id="radio2" value="no" data-bind="checked: $root.selected" />
       <label for="radio2">NO</label>
</fieldset>

显示页面时，无论$ root.selected（是/否）的值如何，都不会选中单选按钮。经过大量调试后，我发现如果我删除标签元素，或者即使我将标签标签更改为span / div标签，它也能正常工作。

知道没有用标签检查单选按钮的原因吗？

感谢。

Answer 1

jQM隐藏原生广播/复选框并将其包装在label中。 label收到所有样式，以便选中。当您将广播/复选框的.prop()更改为true或false时，您需要重新加强 / 刷新手动元素，$(element).checkboxradio("refresh")。

我不是knockout.js专家，但下面是一个实现你想要的例子。

var viewModel = function (status, elm) {
    var self = this;
    self.bar = ko.observable(status ? status.bar : false);
    /* refresh radio/checkbox to re-apply styles */
    self.foo = $(elm).prop("checked", self.bar()).checkboxradio("refresh");
};

ko.applyBindings(new viewModel({
    bar: true
}, $("#radio1")));

<强> Demo

没有检查Knockout / Jqm单选按钮

1 个答案: