javascript - javascript初学者,幻灯片无法运行

标签 javascript html css slideshow

我遵循了一个简单的 javascript 幻灯片教程。它运行得很完美,我们在内部将 javascript 放入了 html 文档中。当我尝试将代码链接到我制作的页面并尝试单击下一个或上一个时,该页面只会重新加载第一张图像。有什么想法吗?

这是我的 html 代码

 <!DOCTYPE html>
<html>
<head>
    <link type="text/css" rel="stylesheet" href="stylesheetmusic.css"/>
    <script type="text/javascript" src="slidescript.js"></script>
    <title>New York Knicks</title>
</head>
<body>
    <div id="header">
        <p id="name">Nicholas Johnson</p>
        <a href="mailto:<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="63090c0b0d0d02230502110e0a0d0407020f064d060716" rel="noreferrer noopener nofollow">[email protected]</a>">
 <p id="email"><a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f9939691979798b99f988b9490979e9d98959cd79c9d8c" rel="noreferrer noopener nofollow">[email protected]</a></p></a>
    </div>
    <div class="left">
        <ul>
            <li><a href="aboutme.html">Home</a></li>
            <li><a href="sports.html">Sports</a></li>
            <li>Hobbies</li>
        </ul>
    </div>
    <div class="right">
        <h4>blink-182</h4>
        <h4>Hometown:</h4>
        <p>San Diego, CA</p>

        <h4>Record label:</h4>
        <p>Independent</p>
        <h4>Band Members:</h4>
            <ul>
                <li>Guitar/Vocal: Tom DeLonge</li>
                <li>Bass/Vocals: Mark Hoppus</li>
                <li>Drums: Travis Barker</li>
            </ul>

        <img src="tom.jpg" name="slideshow" />
        <table>
            <tr>
                        <td align="left"><a href="" onclick="return       change_image(-1)">Previous</a></td>
                <td align="right"><a href="" onclick="return change_image(1)">Next</a></td>
            </tr>
        </table>

        </div>
    <div id="footer">
        <p> 15 Baker lane, Levittown, New York 11756 | Tel: (555) 555-5555</p>
        </div>
    </body>
</html>

这是我的 JavaScript 文件

<script type="text/javascript">
        var Image = new Array("tom.jpg", "mark.jpg", "travis.jpg");
        var Image_Number = 0;
        var Image_Length = Image.length - 1;

        function change_image(num){
            Image_Number = Image_Number + num;

            if (Image_Number > Image_Length){
                    Image_Number = 0;
            }

            if (Image_Number < 0){
                    Image_Number = Image_Length;
            }

            document.slideshow.src= Image[Image_Number];
            return false;

        }

    </script>

最佳答案

您需要从 JavaScript 文件中删除脚本标记。 javascript 文件 (slidescript.js) 的完整文本应为:

    var Image = new Array("tom.jpg", "mark.jpg", "travis.jpg");
    var Image_Number = 0;
    var Image_Length = Image.length - 1;

    function change_image(num){
        Image_Number = Image_Number + num;

        if (Image_Number > Image_Length){
                Image_Number = 0;
        }

        if (Image_Number < 0){
                Image_Number = Image_Length;
        }

        document.slideshow.src= Image[Image_Number];
        return false;

    }

关于javascript - javascript初学者,幻灯片无法运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21323782/

相关文章:

javascript - 如何在 JSX 中使用 If-Else

php - Firefox 在我的所有表单中显示用户名和密码?

html - styles.css 资源在服务器上时未加载,在本地工作

html - 如何在 float div中设置多行文本不扩展他的宽度

javascript - 使用 :not() with attributes

javascript - 将字符串附加到具有相同类名的元素

javascript - 自动排序和调整图片库中的图像

jquery - 使用 jquery 的动态边框宽度

javascript - 存储在全局变量中

javascript - 如何使用 JavaScript 中的单击事件更改 HTML Canvas 中的线宽