Question

我有这个简单的代码，它没有任何问题，它运行这里但不是JSFiddle。在检查控制台时，我发现以下错误

Uncaught ReferenceError: fn is not defined

的 LINK TO FIDDLE

var fn = {
  one: function() {
    alert('1')
  },
  two: function() {
    alert('2')
  },
  three: function() {
    alert('3')
  }
};

<button onclick='fn.one()'>1</button>
<button onclick='fn.two()'>2</button>
<button onclick='fn.three()'>3</button>

Answer 1

这只是一个JSFiddle功能。默认情况下，JSFiddle将所有代码包装在$(document).ready()处理程序中。要将JS从包装器中取出并返回到普通DOM的流程中，只需选择＆＃39; Frameworks＆amp ;;下的JSFiddle选项。扩展＆＃39;并从＆＃39; onLoad＆＃39;更改它没有包装头和＃39;或者＆＃39;没有包装身体＆＃39;

Answer 2

将jsfiddle中的下拉列表从onLoad更改为No wrap-in head OR No wrap-in body。

Answer 3

将左侧的选项从onLoad更改为no wrap之一（即no wrap - in <head>或no wrap - in <body>选项，并且运行时没有任何问题。

Answer 4

这是因为jsfiddle将你的代码沙箱放在一个闭包中。

你可以看到你写了var fn（它创建了一个本地var），只需删除var语句使其成为全局语句，你就可以按照现在的方式调用它。 / p>

尽管如此，我建议您使用addEventListener()。

Answer 5

这个关于jsfiddle的代码不起作用，因为这是变量范围在JavaScript中的工作方式。

如果我只改变了

中的几个字符，你可以看到

var fn = // the rest of code ...

到

window.fn = // the rest of code ...

您的示例正常运行＆＃34;正确＆＃34; - http://jsfiddle.net/v3gsmnvq/7/

甚至可以在SO What is the scope of variables in JavaScript?

上阅读范围

为什么这段代码在这里工作但不在JSFiddle上

5 个答案: