Question

我首先获得一个元素：

var i=document.getElementsByTagName("fieldset");

然后我创建一个新对象：

var a=new Fieldset(i[0]);

函数原型是：

slideDown: function() {  
    alert("here");  
}

构造函数是这样的：

function Fieldset(fieldset){  
    this.fieldset=fieldset;
    this.fieldset.addEventListener("click",this.slideDown(this.fieldset),false);  
};

问题是，在创建新对象并且侦听器未附加到元素时，会立即调用slideDown函数。

我在侦听器的构造函数中使用和不使用this前面的代码完成了代码，无法使用。我只是不知道我在哪里摸索这个。

Answer 1

您可以将事件处理程序包装在匿名函数中：

JS Fiddle

var i=document.getElementsByTagName("fieldset");

var a=new Fieldset(i[0]);

function Fieldset(fieldset){
    this.fieldset=fieldset;
    this.slideDown =  function() {
        alert("here");
         }
        var f = this;
        this.fieldset.addEventListener("click", function() {
            f.slideDown(f.fieldset)
        },false);
};

Answer 2

好吧，在这个表达中

this.fieldset.addEventListener("click",this.slideDown(this.fieldset),false);

slideDown()在 addEventListener()之前被称为，因为在调用函数之前会对参数进行求值。

您可能意味着将函数对象作为第二个参数传递，而不是传递slideDown()返回的值（无论如何都不会返回任何内容）。你可以用这种方式构造这样一个函数对象：

function Fieldset(fieldset){ this.fieldset=fieldset; var self = this; // stash "this" for use inside listener below. var listener = function() { self.slideDown(fieldset); }; this.fieldset.addEventListener("click", listener, false); };

我们使用变量self来存储this的值。请注意，this中不再提供listener。

Answer 3

(function (el, h) {
  el.addEventListener("click", function () {h(el);}, false);
})(this.fieldset, this.slideDown);

将参数传递给对象内部的函数

3 个答案: