在JavaScript对象中访问事件处理程序中的变量

Question

我正在尝试创建一个jQuery类，在提交表单时验证输入字段。我在同一页中有不同的表单，需要为每个表单创建一个验证器实例。

HTML：

<form method="post" action="index.php" id="form1">
  <input type="submit" value="Send" />
</form>

<form method="post" action="index.php" id="form2">
  <input type="submit" value="Send" />
</form>

<script type="text/javascript">
var form1 = new DataValidator('#form1');
var form2 = new DataValidator('#form2');
</script>

我想从提交事件处理程序中访问对象变量，但是当我打印this.selector变量时，我看到一个undefined值。 JavaScript

function DataValidator(selector)
{
  this.form = $(selector);
  this.selector = selector;

  $(selector).submit(function() 
  {
    alert('submit ' + this.selector);
    return false;
  });
}

- Giorgio

---

推荐阅读：this 在 MDN 上的介绍。 - katranci

Answer 1

this 不是一个本地变量，因此它不会保存在闭包中。你需要将其保存在本地变量中。在jQuery事件处理程序中，this 总是绑定到事件的目标。

function DataValidator(selector)
{
  this.form = $(selector);
  this.selector = selector;
  var self = this;

  this.form.submit(function() 
  {
    alert('submit ' + self.selector);
    return false;
  });
}

- Barmar

---

事实上，OP代码中的this只是form对象，而不是由DataValidator构造函数创建的对象。 - King King