为什么我的 JavaScript 不能在 JSFiddle 中工作？

小开

最佳答案

该函数是在一个加载处理程序中定义的，因此处于不同的作用域中。正如@ellisbben 在注释中指出的，您可以通过在 window对象上显式定义它来修复这个问题。然而，更好的做法是将它更改为不引人注目地将处理程序应用于对象: http://jsfiddle.net/pUeue/

$('input[type=button]').click( function() {
alert("test");
});

注意，以这种方式而不是内联方式应用处理程序可以保持 HTML 的整洁。我使用的是 jQuery，但是你可以使用或不使用框架，或者使用不同的框架，如果你喜欢的话。

小开

如果不指定换行设置，则默认为“ onLoad”。这导致所有 JavaScript 都被包装在一个函数中，在结果加载之后运行。所有变量都是此函数的局部变量，因此在全局范围内不可用。

将包装设置改为“不包装”，它就会工作:

http://jsfiddle.net/zalun/Yazpj/1/

我将框架切换到“ No Library”，因为您不使用任何库。

小开

还有另一种方法，把函数声明成这样的变量:

test = function() {
alert("test");
}

JsFiddle

细节

EDIT (based on the comments of @nnnnnn)

@ nnnnnn:

为什么说 test =(没有 var)会修复它？

当你定义这样一个函数时:

var test = function(){};

这个函数是在本地定义的，但是当你在没有 var的情况下定义你的函数时:

test = function(){};

test是在位于顶级作用域的 window对象上定义的。

为什么会这样？

就像@zalun 说的:

如果不指定换行设置，则默认为“ onLoad”。这导致所有 JavaScript 都被包装在一个函数中，在结果加载之后运行。所有变量都是此函数的局部变量，因此在全局范围内不可用。

但是如果你使用这样的语法:

test = function(){};

您可以访问函数 test，因为它是全局定义的

参考文献:

小开

更改“框架和扩展”面板中的换行设置为“无换行 <body>”

小开

您的代码没有问题。只需从右侧选择扩展名 onLoad ()。

小开

Select OnDomready

HTML:

<input id="dButton" type="button" value="test"/>

JavaScript:

addEventListener('load', init, false);


function init()
{
oInput = document.getElementById('dButton');
oInput.onclick = test;
}


function test(){
alert("test");
}

小开

<script>
function test(){
alert("test");
}
</script>


<input type="button" value="test" onclick="test()">