1

我正在学习如何创建自己的插件，并强烈关注http://docs.jquery.com/Plugins/Authoring上的文章。我有一个问题的特定部分与向元素添加事件有关，如http://docs.jquery.com/Plugins/Authoring#Events所示。

http://jsfiddle.net/bhcEk/包含现场演示。基本相同，除了绑定 click() 事件而不是 resize 事件，并将插件应用于给定类的多个元素，除了一个元素。

单击元素会导致 (3) 警报。从文章中的以下脚本可以看出，该事件是在 each() 循环中添加的，因此这是意料之中的。

编辑。哎呀！虽然比我还差。它将它添加到 windows 元素中，因此单击时所有元素都会触发它。也许只是用 $(this) 返回 $(window)？

在我看来，这篇文章是错误的，应该只添加一次（并在销毁下删除）。然而，写这篇文章的人比我更有经验，我怀疑他们可能是愚蠢的。是文章错了，还是我错了？

init : function( options ) {
 return this.each(function(){
  $(window).bind('resize.tooltip', methods.reposition);
});
4

2 回答 2

0

文章看起来不错。在您的小提琴中，所需的行为会有所不同，因此应用它的上下文也必须如此 - 您假设this现在更合适是正确的。

听起来你一直盯着屏幕太久了;-)

编辑（回应评论）：

jQuery 中的几乎所有内容都被封装以避免冲突。冒着混淆事情的风险，“绑定”就像一个先进先出堆栈（先进先出数组）。

在文章中的示例中，您将行为应用于彼此不知道（并且不需要）的多个单独元素，它们只是共享一个公共事件 - 当示例中的函数绑定到event 它实际上是在窗口的事件堆栈中添加多个处理程序。

可能过于简化的伪：

window.events [ // array [ event, namespace, function ]
  [ 'resize', 'tooltip', function(){ /* specific to element 1 */ }],
  [ 'resize', 'tooltip', function(){ /* specific to element 2 */ }],
  [ 'resize', 'tooltip', function(){ /* specific to element 3 */ }]
]

当 window resize 事件被触发时，它会依次运行堆栈中的每个函数。“工具提示”命名空间不引用特定的事件处理程序，它是一组类似的处理程序的名称，这些处理程序最终彼此独立。

我希望这是有道理的，很难用语言来表达。

于 2012-10-26T14:29:17.660 回答
0

您的插件实例与文章实例之间的区别在于，该元素只有一个$(window)和一个resize()同时发生的事件。然后，本文将其用作reposition()方法何时触发的基础。

在您的实例中，有 3 个.tooltip元素。通过返回.each()3 个元素并回调click绑定到 的函数，$(window)它实际上会为每个元素触发事件。

不是绑定到$(window)，而是绑定到$(this)（仅将事件绑定到当前目标（单击的.tooltip）。

这是我提到的一个更改的原始文件。

于 2012-10-26T14:29:40.873 回答