2

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

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

我有一个 id_nums 的 observableArray(比如 idlist),没有关于选择框的分隔。例如,

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 指令,则不会出现此问题。

任何建议都将受到欢迎。

谢谢。

4

1 回答 1

2

selectedOptions绑定旨在用于<select>启用多选的单个标签。它将在选定的选项框中保留每个项目的数组。

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

  1. 更新目标<select>火灾。
  2. <option>绑定从底层的可观察数组中提取值并更新。
  3. 可观察数组触发更新,因为值已更改。
  4. 辅助下拉菜单响应更新,并根据数组中的内容更新其选择的值。
  5. <option>由于该组标签中不存在任何值,因此该值被清除。

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

于 2012-08-26T23:34:24.890 回答