1

我正在用 Javascript 和 jQuery 编写一个内部小工具。我以面向对象的方式编写了一个名为 ggObj 的顶级对象，并通过 ggObj.prototype 分配了方法。

要使用我的小工具，您需要包含 myGadget.js 文件并在页面中调用函数 makeMyGadget()。我的 JS 文件如下所示：

var myGG ; 

function ggObj = {  // lots of stuff here }
ggObj.prototype = { // more stuff here }

var makeMyGadget = function() {

   myGG = new ggObj();
   myGG.initialize(); 
   myGG.print(); // write HTML for my gadget to the 
                 // browser, a la a HERE DOC
   myGG.doOtherFancyStuff();
}

到目前为止，它运作良好。

我的问题是该小工具没有像我希望的那样封装。就目前而言，每个页面只能有一个小工具 (myGG)。更糟糕的是，在我的代码中，我不得不引用特定的对象实例 (myGG)。两个例子是：

  1. myShinyRedButton 的 onClick 执行“myGG.submitForm()”，并且

  2. 做“动画”，我有以下代码行：

    this.intervalID = setInterval("myGG.pageData(1)", this.options.animate);

我需要更改哪些内容才能正确封装我的代码，以便一个页面上可以存在多个小工具？

4

2 回答 2

3

你可能想看看创建一个 jQuery 插件。

$.fn.MYPLUGINNAME = function() {
  return this.each(function() {
  //your code to manipulate the element here
  //you can use this to refer to a specific instance of an element
  //if you apply the plugin to multiple elements on the page.
 });
}

然后，您可以将 MYPLUGINNAME 添加到页面上的任何元素。

 $('a').MYPLUGINNAME();

所以要做动画等，你现在可以使用内置的 jQuery animation() 函数。

网上有几个教程可以提供帮助。像这样：

于 2009-12-09T18:07:46.817 回答
0

看起来您只需要一点 OO。

于 2009-12-09T18:09:07.980 回答