Question

我正在尝试建立一个浏览图片库的网站。当我单击上一个或下一个按钮时，我收到的错误代码为：'错误：无法获取未定义或空引用的属性'样式'。谁能告诉我为什么会这样？谢谢你的帮助！

这是我的JavaScript代码：

window.onload = showImage(imgName);

function showImage(imgName) 
{
    var largeImg = document.getElementById("large");
    var thePath = "images/";
    var theSource = thePath + imgName;

    largeImg.src = theSource;
    largeImg.alt = imgName;

}

var currentIndex = 0;
function nextGall()
{
    var gallery = new Array();
    gallery = document.getElementsByClassName("gall");

    if(currentIndex >= gallery.length)
    {
        currentIndex = gallery.length - 1;
        document.getElementById("next").src = "images/nextEnd.jpg";
    }

    if (currentIndex > 0)
    {
        document.getElementById("previous").src = "images/previous.jpg";
    }

    currentIndex +=1;

    for (var x = 0; x < gallery.length; x++)
    {
        gallery[x].style.display = "none";
    }

    gallery[currentIndex].style.display = "block";
    return false;
}

function prevGall()
{

    var gallery = document.getElementsByClassName("gall");
    currentIndex -= 1;

    if(currentIndex <= 0)
    {
        currentIndex = 0;
        document.getElementById("previous").src = "images/previousEnd.jpg";
    }

    if(currentIndex < gallery.length)
    {
        document.getElementById("next").src = "images/next.jpg";
    }

    for (var x = 0; x < gallery.length; x++)
    {
        gallery[x].style.display = "none";
    }

    gallery[currentIndex].style.display = "block";
    return false;   
}

Answer 1

感谢Barmar和cookie monster，这是我的代码错误的解决方案。我删除了window.onload命令并移动了代码行'currentIndex = + 1;'所以导航将停在gallery数组中的最后一个元素。这是工作代码：

function showImage(imgName) 
{
    var largeImg = document.getElementById("large");
    var thePath = "images/";
    var theSource = thePath + imgName;

    largeImg.src = theSource;
    largeImg.alt = imgName;

}

var currentIndex = 0;
function nextGall()
{
    gallery = document.getElementsByClassName("gall");
    currentIndex +=1;

    if(currentIndex >= gallery.length - 1)
    {
        currentIndex = gallery.length -1;
        document.getElementById("next").src = "images/nextEnd.jpg";
    }

    if (currentIndex > 0)
    {
        document.getElementById("previous").src = "images/previous.jpg";
    }

    for (var x = 0; x < gallery.length; x++)
    {
        gallery[x].style.display = "none";
    }

    gallery[currentIndex].style.display = "block";
    return false;
}

function prevGall()
{

    var gallery = document.getElementsByClassName("gall");
    currentIndex -= 1;

    if(currentIndex <= 0)
    {
        currentIndex = 0;
        document.getElementById("previous").src = "images/previousEnd.jpg";
    }

    if(currentIndex < gallery.length)
    {
        document.getElementById("next").src = "images/next.jpg";
    }

    for (var x = 0; x < gallery.length; x++)
    {
        gallery[x].style.display = "none";
    }

    gallery[currentIndex].style.display = "block";
    return false;   
}

JavaScript错误：无法获得属性＆＃39;样式＆＃39;未定义或空引用

1 个答案: