0

假设我有类似的东西：

var MyApp = function() {
this.name = "Stacy"
}

MyApp.prototype.updateName = function(newname) {
this.name = newname;
}

在我的主页中，我有一个：

$(function () {
  var instance = new MyApp();
})

我有一个按钮事件处理程序可以更新名称：

$("#button").on("click", function(evt) {                        
    // Update the name in MyApp to something else...
    instance.name = "john" // I do not like using instance here, because it has to be "instance" has to be created before I can use it. I want to be able to make this independent of "instance" being created or not
});

这样做的正确方法是什么，以便按钮处理程序将更新“MyApp”以具有正确的名称，而不明确使用创建的 myapp“实例”作为按钮的单击处理程序的一部分？

理想情况下，我想将该 jquery 事件处理程序推到“MyApp”的某个地方，这样我就可以执行以下操作：

MyApp.prototype.events = function() {
    $("#button").on("click", function(evt) {                        
        this.name = "john"
    });
}

虽然它不起作用，因为这指的是别的东西。

如何正确构建我的应用程序，以便事件处理程序或多或少地更新“MyApp”的属性，以便它可以独立于创建的“实例”（即我不再需要使用“实例”）？

4

1 回答 1

0

首先，如果您创建了一个 setter 函数，那么使用它是个好主意！:D

$("#button").on("click", function(evt) {                        
    // Update the name in MyApp to something else...
    //instance.name = "john"
    instance.updateName("john");
});

然后，将事件处理程序放在对象 MyApp 的方法中是没有意义的，因为它永远不会绑定 onclick 事件，直到您触发 events()

然后...我的组织方式是使用 jQuery 文档 onload 将所有 DOM 对象与您的应用程序的功能绑定。通常是这样的：

MYAPP = {};

MYAPP.say_something = function () {

    alert('lol, you clicked me!');

};

...

$(function () {

    $('#my_button').click(MYAPP.say_something);
    $('#other_element').mouseenter(MYAPP.another_method);

});

对于大型应用程序，您必须使用大量元素，如果您有一个用于 DOM 元素的命名空间，则可以更好地组织代码，如下所示：

MYAPP.fetch_dom = function () {

    return {
        my_button: $('#my_button'),
        other_element: $('#other_element')
    };
};

你可以用一种非常简洁的方式绑定事件

$(function () {

    // first initiate DOM
    my_dom = MYAPP.fetch_dom();

    // Then bind events
    my_dom.my_button.click(MYAPP.say_something);
    my_dom.other_element.mouseenter(MYAPP.another_method);

});

这样，您不必从程序的一千个点中寻找 DOM 中的特定元素，将硬编码的 id 散布到各处，并对 DOM 结构执行无效搜索。

最后，在 JS 中使用字面量比使用 new 这个词要好得多。JS 是一种原型 OOP 语言，而 new 有点“违背自然”，可能会让人头疼。

于 2013-03-07T17:50:16.757 回答