无法导入外部Javascript文件

Question

我是javascript编程的新手，我正在尝试使用名为Cycle（jQuery插件）的插件来构建基本的图像幻灯片，我正在尝试将此插件导入到我的代码中，但是由于某种原因它无法正常工作，我已经包括了jQuery库，并且效果很好

这是HTML（ <head>标记中的+ jQuery）：

<!DOCTYPE html>
<html lang="he">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Image Gallery</title>
    <script src="scriptCycle.js"></script> /* This line doesn't work */
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script type="text/javascript">
        $(document).ready(function(){
            $("#slideshow").css("overflow", "hidden"); /* This line works just fine */

            $("ul#slides").cycle({ /* This is from the Cycle plugin (scriptCycle.js) - doesn't work */
                fx: "fade",
                pause: 1,
                prev: "#prev",
                next: "#next"
            });

            $("#slideshow").hover(function() { /* This line works just fine */
                $("ul#nav").fadeIn();
            },

            function() {
                $("ul#nav").fadeOut();
            });
        });
    </script>
</head>
<body>
    <div id="container">
        <div id="slideshow">
            <ul id="nav">
                <li id="prev"><a href="#">Previous</a></li>
                <li id="next"><a href="#">Next</a></li>
            </ul>
            <ul id="slides">
                <li><img src="1.jpg"></li>
                <li><img src="2.jpg"></li>
                <li><img src="3.jpg"></li>
            </ul>
        </div>
    </div>
</body>
</html>

这是CSS（style.css）：

body, h1, ul, li {
    margin: 0; padding: 0; border: 0;
}

body {
    background: #FFF
}

#container {
    width: 1095px; margin: 40px;
    position: relative;
}

#slideshow {
    width: 800px; height: 400px; padding: 15px 0 0 12px;
    background: #FFF;
    overflow: scroll;
    position: relative; z-index: 5;
}

div#slideshow ul#nav {
    display: none;
    list-style: none;
    position: absolute; top: 210px;
}
div#slideshow ul#nav li#prev {
    position: absolute;
    left:30px;
}

div#slideshow ul#nav li#next {
    position: absolute;
    left:740px;
}

div#slideshow ul#nav li a {
    display: block; width: 24px; height: 35px; text-indent: -9999px;
}

div#slideshow ul#nav li#prev a {
    background:url(leftArrow.png);
}

div#slideshow ul#nav li#next a {
    background:url(rightArrow.png);
}

div#slideshow ul#slides {
    list-style: none;
}

div#slideshow ul#slides li {
    margin: 0 0 20px 0;
}

文件路径存在0个错误的空间，它们可以在同一目录中一起找到，我在这里想念什么？

Answer 1

在加载jquery.min.js的行之后放置<script src="scriptCycle.js"></script> ，因为您说它是它的插件。 它可能会出错。

Answer 2

应当将jquery放在自定义脚本之前，添加到索引的所有脚本将按从上到下的顺序工作，因此它始终调用您首先尝试启动的库。

只需将其更改为以下内容：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="scriptCycle.js"></script>

无法导入外部Javascript文件

问题描述

2 个解决方案

解决方案1
2 2015-04-30 23:02:15

解决方案2
0 2015-04-30 23:06:32

无法导入外部Javascript文件

问题描述

2 个解决方案

解决方案1 2 2015-04-30 23:02:15

解决方案2 0 2015-04-30 23:06:32

解决方案1
2 2015-04-30 23:02:15

解决方案2
0 2015-04-30 23:06:32