如何使用javascript点击一个图像更改为图像

时间:2012-11-15 23:55:43

标签: javascript html

您好我正在尝试使用JavaScript创建一个库。 我想在底部有一排小图像,当你点击它时,它会在上面一个更大的窗口中显示该图像。并且该窗口当前包含和图像。

JavaScript新手所以不是百分之百确定我在做什么。 这是我试图使用但没有工作。 任何提示都会非常感谢。:

<script>
function changeimage(val)
{
    var x = val.getAttribute("src");
    var y = getElementById("Display");
    var z = y.getAttribute("src");
    z.setAttribute("src","x");
}
</script>


<img class="mid_one" src="Images/home3.jpg" alt="home1" width="186px" height="186px" onclick="changeimage(this)"/>

提前致谢。

<img name="Display" id="Display" src="Images/home2.jpg" width="450" height="450" alt="Displayed Image"/>

编辑:添加显示

2 个答案:

答案 0 :(得分:0)

试试这个

function changeimage(val)
{
    var x = val.getAttribute("src");
    var y = getElementById("Display");
    y.setAttribute("src",x);
}

根据你的逻辑var z = y.getAttribute("src");是一个字符串和not an Element ..在下一行中,你似乎将属性设置为字符串..

答案 1 :(得分:0)

您应该在元素(y)上设置属性,不能在属性值(z)上设置属性。

此外,您应该使用变量x从其他图像获取源,而不是字符串"x"

var x = val.getAttribute("src");
var y = document.getElementById("Display");
y.setAttribute("src", x);