如何动态更新 dropkick.js 下拉菜单中的选项？答案

【问题标题】：How do I dynamically update options in a dropkick.js dropdown menu?如何动态更新 dropkick.js 下拉菜单中的选项？
【发布时间】：2012-02-03 21:35:03
【问题描述】：

我正在尝试使用dropkick.js 在网络应用程序中构建下拉菜单。我喜欢 dropkick.js，因为它支持键盘和良好的自定义主题功能。但是，它似乎只适用于静态菜单；当我动态更新原始元素（使用 knockout.js 绑定）时，dropkick.js 菜单不会更新。

澄清一下，问题在于以编程方式更改 selectedChannel（或频道列表本身）的值不会导致下拉菜单更新。另一种方法确实有效（点击下拉菜单，查看 selectedChannel 变量更新）。

非常感谢您提供指向此问题的现有解决方案的链接或有关如何通过修改 dropkick.js（或使用自定义的 knockout.js 绑定？）自行解决此问题的指针。或者，也许它可以/应该工作，但我做错了什么？

使用 knockout.js 进行绑定：

<select id="channelSelector" data-bind="options: channels, optionsText: 'name', optionsValue: 'id', value: selectedChannel"></select>

设置代码：

$('#channelSelector').dropkick();

使用 knockout.js 更新代码不会导致下拉菜单更新其选定值：

vm.selectedChannel(vm.channels()[0].id);

【问题讨论】：

【解决方案1】：

你应该阅读这个答案和 cmets，这就是帮助我完成它的原因。

干杯！

【讨论】：

【解决方案2】：

关于selectedChannel的更新，我已经为你制作了一个可行的脚本

干杯！

【讨论】：

感谢您的努力！不幸的是，另一个方向不起作用：更改变量，查看 UI 更新。这是一个更新的小提琴来演示这个问题。 http://jsfiddle.net/37QvY/