Question

http://jsfiddle.net/E2AMX/有问题的确切证明，即：我在同一页面上有多个选择框。选择框的所有选项都采用给定的形式：

<option value="#id_num">StringVal</option>

我有一个id_nums的observableArray（比如idlist），没有关于selectboxes的分离。例如，

idlist = ko.observableArray([1,2,3,4]);

并且选择框为

<select name="first" data-bind="selectedOptions: idlist">
    ...
    <option value="2">Blah</option>
    <option value="3">Blah</option>
    ...
</select>

<select name="second" data-bind="selectedOptions: idlist">
    ...
    <option value="1">Blah</option>
    ...
</select>

<select name="third" data-bind="selectedOptions: idlist">
    ...
    <option value="4">Blah</option>
    ...
</select>

我的问题是：当我从选择框中选择一个选项时，其他选择框会返回其初始状态。这与selectedOptions直接相关，因为如果我删除selectedOptions指令，则不会发生此问题。

任何建议都会受到欢迎。

感谢。

Answer 1

selectedOptions绑定意味着在启用了多选的单个<select>标记上使用。它将在选项框中保留每个项目的数组。

您看到行为的原因是因为当您从其中一个下拉列表中选择单个值时，selectedOptions绑定会立即触发。逻辑是这样的：

目标<select>的更新火灾。
绑定从<option>中提取值并更新基础可观察数组。
由于值已更改，因此可观察数组将触发更新。
辅助下拉响应更新，并根据数组中的内容更新其选定值。
由于<option>标记集中不存在任何值，因此该值将被清除。

这就是您看到此行为的原因。如果要从所有选定的选项中收集复合，则需要编写新的自定义绑定，或者为要绑定的每个<select>创建单独的数组。

使用多个选择框上的selectedOptions的一个选项列表进行淘汰赛

1 个答案: