0

我有一个非常简单的选择框：

<select multiple="multiple" name="Condiments">
  <option selected="selected">Mustard</option>
  <option selected="selected">Ketchup</option>
</select>

我正在使用 jQuery UI MultiSelect Widget 让它更漂亮一点：

https://github.com/ehynds/jquery-ui-multiselect-widget

具体来说，我试图在初始化小部件时动态设置其中一个选项。当我这样做时：

$("select").multiselect({
  selectedText: function(numChecked, numTotal, checkedItems){
    return "Foo";
  }
});

它正确地将 selectedText 选项设置为“Foo”但是当我这样做时：

$("select").multiselect({
  selectedText: function(numChecked, numTotal, checkedItems){
    return $(this).attr("name");
  }
});

它认为 $(this) 是 DOM 中其他地方的跨度。

如果页面上只有一个选择，这很好，但是有多个我需要一种方法来为每个选择设置此选项。有没有一种明显的方法可以从 $(this) 到当前的选择元素？还是解决相同一般问题的明显替代方案？

4

2 回答 2

2

我认为在selectedText回调中，是为元素this检测多选功能的 JavaScript 对象。<select>它有一个element属性，即包装<select>元素的 jQuery 对象。

因此，您应该使用：

$("select").multiselect({
    selectedText: function(numChecked, numTotal, checkedItems){
        return this.element.attr("name");
    }
});
于 2013-04-13T02:31:37.613 回答
0

在需要从元素实例传递特定数据或属性但未内置在插件中的多个元素上初始化插件的常用方法是使用以下方法循环元素集合each：

$('select').each(function(){
   /* "this" will be instance of "select"*/
  /* prep data needed before initialiizing plugin*/

   var name= this.name;
   /* initialize plugin for current instance of element*/
   $(this).multiselect({
      selectedText: function(numChecked, numTotal, checkedItems){
        /* variable declared above*/
         return name;
       }
    });

});

我不知道特定的插件，或者this回调中的内容，但是使用显示的方法没有必要知道，因为实例已经在each循环中被隔离

编辑。我写这篇文章时没有考虑插件是用于<select>元素的。不知道你为什么要name被退回..对于任何选择的选项都是一样的

于 2013-04-13T02:35:35.233 回答