向对象内部的函数传递参数

Passing parameters to function inside object

本文关键字：参数 函数 对象 内部      更新时间：2023-09-26

我首先获得一个元素:

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的情况下为侦听器完成了代码，但无济于事。我只是不知道我在哪里摸不着头绪。

在这个表达式中

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中不再可用。

您可以将事件处理程序封装在一个匿名函数中:

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);
};

(function (el, h) {
  el.addEventListener("click", function () {h(el);}, false);
})(this.fieldset, this.slideDown);
相关文章：