以面向对象的方式使用jQuery

Question

是否有可能使用jQuery实现以下目标:我想创建两个具有不同功能且具有相同名称的不同对象.

var item = new foo();
item.doSomething();
var item2 = new bar();
item2.doSomething();

此外,我希望能够将创建的项目用作"常规"jQuery对象 - 例如,拖动项目并在拖动停止时执行正确的doSomething()函数.

Answer 1

我们已经找到了解决问题的方法.它由3个独立的步骤组成:首先,必须创建初始的jQuery项:

var item = $.create("div");

然后创建一个你想要创建的javascript对象的实例,并将它的所有函数和属性复制到jQuery项:

$.extend( item, new foo.bar() );

最后,初始化对象.请注意,上一步中的构造函数不能用于此,因为"this"对象是不同的.

item.initialize();

在此之后,对象$(item)可以像常规jQuery对象一样使用,而且它具有函数和局部变量,如常规javascript对象.

item.doSomething();
var offset = $(item).offset();

因此,您可以创建具有可由jQuery使用的"类"的DOM对象.顺便说一句,我们使用DUI来创建名称空间.

希望有人会发现解决方案很有帮助.它使我们的代码更好.

Answer 2

我仍然是JS和jQuery的新手,所以请随意向我发起攻击(又称"提供建设性的批评"),但我发现这对于构建具有屏幕表示的JS对象非常有用:

function SomeClass (params) {
    // other properties and functions...

    this.view = function () {
        var e = $('<div />', {
            'class': 'someClass'
        });
        return e;
    }();
}

var someClassInstance = new SomeClass(params);
$('#someClassContainer').append(someClassInstance.view);

来自更传统的OOP背景,并习惯使用MVC模式,这对我来说很友好.任何建议欢迎......