0

我有一个 JavaScript 类

MyClass = function() { }
MyClass.prototype.init = function(param){ }
MyClass.prototype.reset = function() { }

如果我使用它从 HTML 页面调用这些函数onClick="reset()"，效果很好。但是如果我从 jQuery 调用这些函数，它就不起作用。请给我建议。来自 jQuery 的示例调用：

$(document).ready(
    function()
    {
        app = new MyClass();
        app.init(someid, url,
            "event_handling": {
                "event1":app.reset
            });
    })

除了上述之外，是否可以添加 CSS 规则，例如：

"css_class_names": {
                        style-1: "firstStyle",
                        style-2: "secondStyle"
                    }

如果可能的话，那么我如何将样式应用于具有 ID 的特定元素提前谢谢！

4

2 回答 2

1

您的问题是，当应用程序调用 event1 时，它将从与您预期不同的上下文中调用 app.reset。换句话说，在您的 app.reset 中，“this”变量不会是您想要的。原因是当你声明event1: app.reset它时，它会将 event1 设置为函数 app.reset。

解决方法：

"event1": function() { app.reset(); }
于 2013-02-28T09:21:00.507 回答
0

你还没有真正显示你的 jQuery 调用，但我猜想：实际上，你有，但问题不在于 jQuery 调用。请参阅下面中断下的注释。

假设：

$("some selector").click(app.reset);

...您将app's 方法之一作为事件处理程序传递。

它不起作用的原因是在对方法的调用中，this不会引用app实例，而是引用 DOM 元素。在 JavaScript（目前）中，this完全由函数的调用方式定义，而不是在哪里定义。

您可以this在调用期间使用 jQuery 的$.proxy函数为函数提供正确的值：

$("some selector").click($.proxy(app.reset, app));

或者，ECMAScript5Function#bind为此定义：

$("some selector").click(app.reset.bind(app));

...但这要求您在实现它的引擎上运行，或者您有一个 ES5 垫片。

或者，如果您碰巧有一个方便的闭包，则可以使用闭包：

$("some selector").click(function() {
    app.reset();
});

app在那里，我们通过在它上面创建一个闭包（我们作为事件处理程序传递的函数）来使用你有变量的事实。

更多（在我的博客上）：

在您的代码中：

$(document).ready(
    function()
    {
        app = new MyClass();
        app.init(someid, url,
            "event_handling": {
                "event1":app.reset
            });
    })

上述讨论适用于

"event1":app.reset

如果稍后您致电event1()，this则不会app。

您可以应用上述修复，如下所示：

jQuery.proxy：

"event1":$.proxy(app.reset, app)

Function#bind：

"event1":app.reset.bind(app)

关闭：

"event1":function() { app.reset(); }
于 2013-02-28T09:21:23.537 回答