1

如何从 HTML 链接执行 JS 对象的函数属性？我有以下JS：

function Tester(elem) {
    this.elem = document.getElementById(elem);
}

Tester.prototype.show = function() {
    this.elem.innerHTML = '<a href="javascript: this.test();">test</a>';
};

Tester.prototype.test = function() {
    alert("a");
};  
​

这是HTML：

<script type="text/javascript">
    var test = new Tester("test");
    test.show();
</script>

当我单击呈现的链接时，它无法识别该test()功能。当用户单击链接时，我将如何获得它，该test()功能被执行？

4

1 回答 1

4

正确的方法是创建一个 DOM 元素并使用 JavaScript 附加事件处理程序：

Tester.prototype.show = function() {
    var a = document.createElement('a'),
        self = this; // assign this to a variable we can access in the 
                     // event handler

    a.href = '#';
    a.innerHTML = 'test';
    a.onclick = function() {     
        self.test();
        return false; // to prevent the browser following the link
    };

    this.elem.appendChild(a);
};

由于事件处理程序形成一个闭包，它可以访问外部函数 ( Tester.prototype.show) 中定义的变量。请注意，在事件处理程序内部，this不是指您的实例，而是指处理程序绑定到的元素（在这种情况下a）。MDN 对this.

quirksmode.org有一些关于事件处理、绑定事件处理程序的各种方法、它们的优缺点、浏览器中的差异以及事件处理程序中的行为方式的精彩文章。this

熟悉DOM 接口当然也很有帮助。

于 2012-05-20T00:32:26.103 回答