选择菜单显示多次

Question

我有选择HTML控件类似如下：

<select name="width-dimension-inches" id="width-dimension-inches" data-bind="value: widthWhole,jqmSelectMenuRefresh :true, options: widthDimension.dimension.getDimensionsWhole()"> 

</select> 

我创建了一个自定义的淘汰赛绑定称为jqmSelectMenuRefresh因为每当我选择的选择列表的选项我没能看到它在选择列表中。对于jqmSelectMenuRefresh实现如下所示：

define(["jquery", "knockout", "jqueryMobile"], function ($, ko) { 
    ko.bindingHandlers.jqmSelectMenuRefresh = { 

     init: function(element) { 

      $(element).selectmenu().selectmenu('refresh', true); 

     }, 

当我运行上面的代码，我结束了两个selectmenus如下图所示：

我能做些什么来解决这个问题？

更新1：

如果我更新的代码如下：

init: function(element) { 

      $(element).selectmenu('refresh',true); 

然后我收到以下错误信息：

Uncaught Error: cannot call methods on selectmenu prior to initialization; attempted to call method 'refresh' 

Answer 1

每次调用selectmenu()功能新的实例被创建。

$(element).selectmenu().selectmenu('refresh', true); 

上述代码行将创建两个以两个可见元素结尾的实例。

我的建议是初始化插件，该实例存储在变量中，然后这个对象调用函数：

var $instance = $(element).selectmenu(); 
$instance.selectmenu('refresh', true);