锚标记的 onclick 没有在 jsfiddle 中执行简单的 jQuery 函数答案

【问题标题】：Anchor tag's onclick isn't executing a simple jQuery function in jsfiddle锚标记的 onclick 没有在 jsfiddle 中执行简单的 jQuery 函数
【发布时间】：2014-05-20 17:53:01
【问题描述】：

我正在关注一个在线 jQuery 教程，但我无法让这个标记在 jsfiddle 中工作：

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script>
function ShowBox()
{
        $("#divTestArea1").fadeIn();
}
</script>
</head>

<div id="divTestArea1" style="padding: 50px; background-color: #89BC38; text-align: center; display: none;">
        <b>Hello, world!</b>
</div>

<a href="javascript:void(0);" onclick="ShowBox();">Show box</a>

</html>

这是不工作的 jsfiddle 版本：fadeIn test fiddle

单击超链接时应触发 onclick 事件，该事件应调用 ShowBox 函数。 ShowBox 应该“fadeIn()”显示：none div，id #divTestArea1。我究竟做错了什么？

谢谢！

【问题讨论】：

标签： jquery jsfiddle

【解决方案1】：

这样包装后它的工作：

<script type="text/javascript">
function ShowBox()
{
        $("#divTestArea1").fadeIn();
}
</script>

WORKING FIDDLE

【讨论】：

谢谢，Ehsan！顺便说一句，我在您的博客上看到了您的 WPF 应用程序。看起来棒极了！

【解决方案2】：

您的 jsfiddle 无法正常工作，因为您可以选择说明如何错误地加载您的 javascript 库。将其设置为“No wrap - in”，以便在加载 html 之前定义您的函数。

您无需更改任何代码

http://jsfiddle.net/H72NG/5/

function ShowBox()
{
        $("#divTestArea1").fadeIn();
}

【讨论】：