jquery - 如何为 jQuery 插件编写方法？

Question

我编写了一个相当基本的 jQuery 插件，它采用无序列表并创建一个漂亮的多选列表。将其称为“multiSelector”，插件声明如下所示:

jQuery.fn.multiSelector = function(options) {
    // plugin code
}

该插件实际上运行在一个包含 div 上，内部有一个无序列表(出于 CSS 原因等)，因此该插件的典型用法如下所示:

var $listDiv = $('#listDiv') // div that contains unordered list
$listDiv.multiSelector();

它工作得很好，所以我在创建插件时没有遇到任何问题。但是，我现在想做的是为用户提供一种从列表中获取所有选定项目的方法。我在网上查找了如何从这个插件创建函数，但我似乎找不到任何方法来使用函数扩展它。

最好做这样的事情，其中​​“itemArray”是基于列表项 id(或其他内容)的字符串数组:

var itemArray = $listDiv.multiSelector().getSelected();

我意识到我的逻辑可能有很大偏差，但我只是在寻找一些关于如何实现这一目标的指导。也许我需要编写一个新的 jQuery 函数来处理这个特定的任务，或者也许我仍然可以以某种方式将它附加到这个 multiSelector 插件上。任何帮助将不胜感激。

谢谢。

Answer 1

我建议添加调用方法作为插件参数的选项。这是大多数(全部？)jQuery UI 插件处理它的方式。

jQuery.fn.multiSelector = function( options ) {
   if (typeof options === "string") {
      if (options == "selected") {
         ...return the selected elements
      }
      return null;
   }

   options = $.extend( {}, $.fn.multiSelector.defaults, options );

   ... rest of plugin body...
}

然后将其称为

var selected = $('.selector').multiSelector('selected');