2

为什么logfunc“未定义”？

  var logfunc = function(obj) {
     return function() {
       console.log(obj)
     }
   }

  t += '<a onclick="logfunc(this)">&lt;</a>'
4

2 回答 2

2

如果在全局范围之外声明引用longfunc将无法访问，小提琴

我不提倡通过省略直接在全局范围内声明变量，var但它是一个很好的例子：

function setupStuff() {
    var logfunc = function(obj) { //defined within setupStuff scope
        /*...*/
    }
    t += '<a onclick="logfunc(this)">&lt;</a>';
}

function setupStuffDifferently() {
    logfuncB = function(obj) { //defined in the global scope
       /*...*/
    }
    t += '<a onclick="logfuncB(this)">&lt;</a>';
}

我更愿意看到单独声明的函数

t += '<a onclick="logfunc(this)">&lt;</a>';

function logfunc(obj) { //this would work when assigned through `onclick`
       /*...*/
}

如果您可以使用该选项，我建议您使用像 jQuery 这样的库，它在分配和处理点击事件方面提供了更大的灵活性。

于 2012-05-23T04:54:37.100 回答
1

您收到“未定义 logfunc”错误，因为您logfunc不在全局（即window）范围内，并且使用 HTML 元素属性绑定的函数必须是全局的。

您可以通过以下方式解决此问题：

window.logfunc = function(obj) {
  return function() {
    console.log(obj)
  }
};

但这仍然不会像您认为的那样做，因为它logfunc只是返回一个调用的函数console.log并且<a>不知道它应该调用该function() { console.log(obj) }函数，它只会将其视为一个真实值。我想你想要：

window.logfunc = function(obj) {
  console.log(obj)
};

如果您想单击链接以生成控制台消息。

至于“DOM之间onclick和通过DOM有什么区别”：

  1. 通过属性附加的函数必须是全局的，这很快就会导致混乱。
  2. 您只能使用每个元素附加一个函数，onclick但您可以addEventListener根据需要多次调用。如果你想将 JavaScript 片段作为字符串粘贴在一起，你可以绕过这个限制，但这很讨厌。
  3. 同样，您可以使用;轻松撤消addEventListener呼叫 removeEventListener从onclick属性中删除事件处理程序比添加一个事件处理程序涉及更严重的字符串争论。
  4. 不必要地使用onclickHTML 和 JavaScript 会导致维护噩梦。
于 2012-05-23T05:01:18.650 回答