脚本在 jsfiddle 中有效，但在站点中无效答案

【问题标题】：script works in jsfiddle but not in site脚本在 jsfiddle 中有效，但在站点中无效
【发布时间】：2013-07-17 02:47:49
【问题描述】：

我看到其他人问过这个问题，但我找不到适合我的答案。不久前我发布了一个问题，有人给我发了这个 jsFiddle：http://jsfiddle.net/r043v/LgXQX/1/

它完全符合我的需要，网站说它完全有效，但是当我将它粘贴到我的文档中时它不起作用。我读到它会在你 c+p 时添加额外的不可见字符，所以我使用了 jslint，它说我已经摆脱了它们，但它仍然无法正常工作。

这是我页面中的代码（我从头开始，因为它第一次没有工作，所以我可以确定我的代码中没有其他东西把它搞砸了）

    <!DOCTYPE html>

<head>
 <link rel="stylesheet" href="style3.css">
<script type=”text/javascript” src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>

<script>
$("#issues > li").click(function () {
    var $img = $("#theimg");
    var $li = $(this);
    var newsrc = "";
    newsrc = $li.data("img");
    if (newsrc === undefined) newsrc = "issue" + $li.index() + ".jpg";

    var loadstep = 0;

    function endstep() { // end of preload or hide
        if (++loadstep === 2) // if the preload is done and hide too, change src and show picture
        $img.attr("src", newsrc).animate({
            opacity: 1
        });
    }

    // preload picture
    var $tmpimg = $("<img/>", {
        src: newsrc
    }).on("load", endstep);
    // hide container picture
    $img.animate({
        opacity: 0
    }, endstep);
    });
</script>

</head>

css 文件仅包含 jsFiddle 中的内容，并且正文是从 fiddle 的 html 部分复制和粘贴的。任何见解将不胜感激！

【问题讨论】：

您是在 document.ready 中还是在标记之后加载脚本？
请注意，JSFiddle 有onLoad、onDomready 等选项。您的小提琴使用onDomready，而您的sn-p 等效于No wrap - in <head>。
我添加了 document.ready，就像另一个用户在下面发布的一样（字面上复制并粘贴了他们的答案），但它没有改变。我还尝试了使用 no wrap 选项的小提琴，它仍然可以在 jsFiddle 上运行——或者这有关系吗？

标签： javascript jsfiddle

【解决方案1】：

您需要在$(document).ready() 处理程序中加载脚本。小提琴为你添加了它。因此它在那里工作。

$(document).ready(function () {
    $("#issues > li").click(function () {
        var $img = $("#theimg");
        var $li = $(this);
        var newsrc = "";
        newsrc = $li.data("img");
        if (newsrc === undefined) newsrc = "issue" + $li.index() + ".jpg";

        var loadstep = 0;

        function endstep() { // end of preload or hide
            if (++loadstep === 2) // if the preload is done and hide too, change src and show picture
            $img.attr("src", newsrc).animate({
                opacity: 1
            });
        }

        // preload picture
        var $tmpimg = $("<img/>", {
            src: newsrc
        }).on("load", endstep);
        // hide container picture
        $img.animate({
            opacity: 0
        }, endstep);
    });

});

【讨论】：

那么，只需替换标签之间的那个？
似乎没有用。很抱歉这些简单的问题。我是一名学生，被老师为我修理东西给宠坏了。
把它包装在<script type=”text/javascript”>..<script> 中还有，任何控制台错误？
也试过了，没有任何效果。如果有帮助，我正在使用 MAMP 在本地工作。不要阻止javascript或任何东西。 ETA：我在错误控制台中有一个语法错误，提示“SyntaxError: Expected token '}'”
我只有一个链接，但我会尝试另一种方法。感谢您的时间和耐心。