Question

我有一个完整的图像和一堆缩略图。我想用点击的任何缩略图的图像链接替换完整的图像。这是代码：谢谢

function swapImage() {
    var fullCoverImage = document.getElementById("full_cover");

    var linkedImage = this.childNodes[0];
    var thumbSource = linkedImage.getAttribute("src");

    var coverSource = fullCoverImage.getAttribute("src");

    var newSource = thumbSource.replace("_thumb","");
    fullCoverImage.setAttribute("src", newSource);  
}

<a id="slide_thumb" onClick="swapImage();" href="Javascript:void(0);"><img src="images/portfolio/fiction_001_thumb.png" /></a>
<a id="slide_thumb" onClick="swapImage();" href="Javascript:void(0);"><img src="images/portfolio/fiction_002_thumb.png" /></a>

<img id="full_cover" src="images/portfolio/fiction_001.png" />

Answer 1

这应该有效

function swapImage(aTag) {
    var fullCoverImage = document.getElementById("full_cover");

    var linkedImage = aTag.childNodes[0];
    var thumbSource = linkedImage.getAttribute("src");

    var coverSource = fullCoverImage.getAttribute("src");

    var newSource = thumbSource.replace("_thumb","");
    fullCoverImage.setAttribute("src", newSource);  
}

<a id="slide_thumb" onClick="swapImage(this);" href="Javascript:void(0);"><img src="images/portfolio/fiction_001_thumb.png" /></a>
<a id="slide_thumb" onClick="swapImage(this);" href="Javascript:void(0);"><img src="images/portfolio/fiction_002_thumb.png" /></a>

<img id="full_cover" src="images/portfolio/fiction_001.png" />

Answer 2

将onClick="swapImage();"更改为onClick="swapImage(this);" 并使用

function swapImage(ele) {
    var fullCoverImage = document.getElementById("full_cover");

    var linkedImage = ele.childNodes[0];
    var thumbSource = linkedImage.getAttribute("src");

    var coverSource = fullCoverImage.getAttribute("src");

    var newSource = thumbSource.replace("_thumb","");
    fullCoverImage.setAttribute("src", newSource);  
}

编辑：殴打它。

Javascript交换图像

2 个答案: