2

在对如何构建 jQuery 插件有了基本的了解之后，我一直在寻找也将其转换为 Prototype。

我在 这里和插件/扩展幻灯片上找到了这个演示文稿，它显示：

在jQuery中： jQuery.fn.myPlugin = function(args) {return: this;};

在原型中：

Element.addMethods({
  myPlugin: function(element) { 
  return element;
  }
});

我设法像这样将我的简单插件转换为原型，但现在我想知道这是否实际上是编写它的正确方法，或者是否应该实际使用类。我对 OOP 中的类知之甚少，但在 Google 上搜索 Element.addMethods 也没有得到太多启发。

非常感谢！

4

1 回答 1

2

迟到的回复，但根据您的评论，我肯定会为此创建一个课程。

当您想要执行与元素实例相关的功能时，扩展元素很有用。通常，至少对于 Prototype 提供的那些，它们具有更多的实用性质：更改属性值、从 dom 添加/删除等。

我真的无法想象一个元素方法可以包含手风琴所需的所有逻辑。您提到您希望能够在同一页面上拥有多个手风琴 - 这并不要求它是元素方法。您可以定义一个手风琴类，然后为每个要使用它的位置实例化它。

假设您的手风琴类要求您拥有一个容器 div，并且所有打开/关闭选项卡（或者您想要定义它们）都是直接后代。您的标记将如下所示：

<div id="accordion1">
  <div class="slide"><!-- content --></div>
  <div class="slide"><!-- content --></div>
  <div class="slide"><!-- content --></div>
</div>

你会设置你的课程：

var MyAccordion = Class.create({
  initialize: function(containingElement) {
    var slides = $(containingElement).select('.slide');
    ... do all your other stuff, hook up event handlers to open/close, etc
  }
});

并像这样实例化它：

new MyAccordion($('accordion1'));

这肯定会让你有多个实例。这就是使用类的全部意义所在。

如果要扩展 Element 以添加方法，则必须执行以下操作来实例化：

$('accordion1').accordion();

您的所有功能都需要在一个方法中，这似乎不如创建类灵活。只是感觉有点奇怪和错误，也是。

希望这可以帮助。如果您有任何问题，请告诉我。

于 2012-11-07T04:45:47.160 回答