使用javascript添加OnClick事件

时间:2012-12-29 04:48:39

标签: javascript

我正在尝试找到一种方法来创建导致onclick事件的类。例如,在表格中说。我想给那个表单字段一个类。每次我向某个字段添加某个类时,我希望它为表单字段生成一个onclick命令。

我这样做的原因是我想为每个表单字段添加分析跟踪,但我使用重力表单,所以我希望能够动态创建表单而无需编辑每个表单。如果我可以创建一个名为.name的类并让该类将此onClick="mixpanel.track('Name_field');"添加到表单输入中,那么每次用户在表单内单击以填充它时,我都可以跟踪。这样我就可以跟踪表单的每一步,看看用户何时离开。

所以列表将是

.name  that would add onClick="mixpanel.track('Name_field');"
.email  that would add onClick="mixpanel.track('Email_field');"
.phone  that would add onClick="mixpanel.track('pnone_field');"

我希望这是有道理的。谢谢你提供的所有帮助。我是javascript的新手,所以请对我很轻松。 html和css我是专业人士,但javascript是我下一个登山的山峰。

1 个答案:

答案 0 :(得分:1)

委托会更有效,所以你只有一个事件处理程序:

var f = function (e) {
  e = e || window.event;
  var t = e.srcElement || e.target, m;
  while (t !== this && (!t.className || !(m = t.className.match(/\b(name|email|phone)\b/)))) {
    t = t.parentNode;
  }
  if (m) {
    switch (m[0]) {
      case "name": mixpanel.track("Name_field"); break;
      case "email": mixpanel.track("Email_field"); break;
      case "phone": mixpanel.track("phone_field"); break;
    }
  }
};
if (document.body.attachEvent) {
  document.body.attachEvent("onclick", f, true);
} else {
  document.body.addEventListener("click", f, true);
}