Question

我有一个带有一些复选框的面板。通过对某些C＃代码的jquery调用填充复选框。

我意识到，当单击代表复选框的名称的文本时（通过跨度标签的数据绑定完成），该复选框并没有打开和关闭。我为输入标签实现了名称和ID，现在单击文本时只有第一个复选框处于切换状态。其他框/文本不会重复此功能。

<div class="col-xs-12">
            <div class="scroll" style="height:260px;" tabindex="0" data-bind="foreach: Services">
                <div class="col-xs-6" id="ReviewerServices">
                    <div class="checkbox" >

                        <label for="serviceCheckbox">
                            <input type="checkbox"  name="serviceCheckbox" id="serviceCheckbox" data-bind="checked: IsSelected" />
                            <span data-bind="text: ServiceAliasDescription"></span>
                        </label>

                    </div><!-- end checkbox -->
                </div>
            </div><!-- col-xs-4 -->
        </div>

Answer 1

关于您所做的事情有两件事……首先是id 必须在页面上必须唯一。第二个原因是，假设您了解for将标签绑定到具有匹配id的输入，为什么不希望单击任何标签会选中/取消选中 all 的盒子：-）

基本上，正在发生的事情是，您有多个serviceCheckox并告诉每个标签影响“被称为serviceCheckbox的事物”，并且浏览器一发现 first serviceCheckbox”将其选中或取消选中。

您应该要做的是相应地索引id和for。我从未使用过淘汰赛，所以我的语法可能是错误的，但希望您能理解

<label data-bind="{for: 'serviceCheckbox' + $index}">
  <input .... data-bind="{id: 'serviceCheckbox' + $index, checked: IsSelected}" />
  <span ..... >
</label>

点击文本说明复选框，只会切换第一个复选框

1 个答案: