Question

我正在创建一个基于jQuery小部件的富文本编辑器，它可以在页面上有多个实例。第一个实例应生成如下工具栏：

<input type="checkbox" id="bold-1"><label for="bold-1">..
<input type="checkbox" id="italic-1"><label for="italic-1">..
...

第二个实例应该生成：

<input type="checkbox" id="bold-2"><label for ="bold-2">..
<input type="checkbox" id="italic-2"><label for ="italic-2">..

''属性的标签需要唯一引用其对应的输入'id'属性。因此，我需要为每个实例添加一个唯一的ID。

这样的东西可以工作，但我不想在全局命名空间中存储一个计数器：

var textEditorCount;
$.widget("myEditor.textEditor", {
   _create: function () {
      textEditorCount = textEditorCount ? textEditorCount + 1 : 1;
      this.instanceID = textEditorCount;
   },
   ...
};

也许问题归结为:(如何）我可以在窗口小部件的命名空间中存储变量？

Answer 1

您可以使用闭包：

(function () {
  var textEditorCount;
  $.widget("myEditor.textEditor", {
     _create: function () {
        textEditorCount = textEditorCount ? textEditorCount + 1 : 1;
        this.instanceID = textEditorCount;
     },
     ...
  };
})();

textEditorCount不再是全球性的。

Answer 2

由于jQuery UI 1.9每个小部件实例都有唯一的字段this.uuid和this.eventNamespace：

this.uuid = uuid++;
this.eventNamespace = "." + this.widgetName + this.uuid;

https://github.com/jquery/jquery-ui/blob/1.9.0/ui/jquery.ui.widget.js#L215

字段this.eventNamespace适用于分配/清除唯一事件处理程序（http://api.jquery.com/on/ - 阅读“事件名称和名称空间”一章。）

Answer 3

Global Var（或NS）每个实例增加一个这就是我做的事情

如何为jQuery小部件实例创建唯一的id？

3 个答案: