Question

我正在按照教程创建一个包含JavaScript和HTML的幻灯片。

第一张图片和＆＃34;下一张＆＃34;和＆＃34;以前＆＃34;按钮在页面上，但是当我点击下一个或上一个时，它表示无法找到此网页。有谁可以帮助我吗？

可以找到该教程here，我还在下面提供了HTML和JavaScript代码。

html代码是：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/
            xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
     <title>Image Slideshow</title>
     <script type="text/javascript"
         src="script09.js"></script>
</head>
<body bgcolor="#FFFFFF">
     <div align="center">
        <h1>Welcome, Robot Overlords!</h1>
        <img src="images/robot1.jpg"
            id="myPicture" width="200"
            height="400" alt="Slideshow" />
        <h2><a href="previous.html"
            id="prevLink">&lt;&lt;
            Previous</a>&nbsp;&nbsp;<a
            href="next.html" id="nextLink">Next
            &gt;&gt;</a></h2>
     </div>
</body>
</html>

和JavaScript代码

window.onload = initLinks;

var myPix = new Array("images/robot1.jpg",
    "images/robot2.jpg","images/robot3.jpg");
var thisPic = 0;

function initLinks() {
     document.getElementById("prevLink").
         onclick = processPrevious;
     document.getElementById("nextLink").
         onclick = processNext;
 }

function processPrevious() {
     if (thisPic == 0) {
        thisPic = myPix.length;
     }
     thisPic--;
     document.getElementById("myPicture").src =
         myPix[thisPic];
     return false;
}

function processNext() {
     thisPic++;
     if (thisPic == myPix.length) {
         thisPic = 0;
     }

     document.getElementById("myPicture").src =
         myPix[thisPic];
     return false;
}

Answer 1

不要在onload init函数中绑定你的函数，而是尝试：

<a href="previous.html" id="prevLink" onclick="processPrevious();return false;">

您可能会在页面上出现js错误，因此会忽略这些功能，而a标签只会跟随您使用过的链接。打开浏览器的控制台并检查语法错误。

Answer 2

您已在两个链接的href中提供HTML页面网址。

但我认为你只需要更改图像src属性......

在两个链接中使用href="javascript:"。所以在这种情况下不需要event.preventDefault() ......

（href="#"将页面滚动到顶部）.... :)

Javascript幻灯片

2 个答案: