This is the page to show picture, replace placehold with different source by js.
I don’t want it to go to another page when I click the <a> link, so I’m using using onclick="return false". But it doesn’t work. I can’t find the problem.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>my first gallery</title>
<script type="text/javascript" src="scripts/showPic.js"></script>
</head>
<body>
<h1>Snapshot</h1>
<a href="images/6.jpg" onclick="return false; ">Click me</a>
<ul>
<li>
<a href="images/1.jpg" onclick="showPic(this);
return false;" title="first picture" >my favorite </a>
</li>
<li>
**<a href="images/2.jpg" onclick="showPic(this); return false;" title="second picture">second my favorite</a>**
</li>
</ul>
<ol>
<li>
<a href="images/3.jpg" onclick="showPic(this); return false;" title="third picture" >third my favorite </a>
</li>
<li>
<a href="images/4.jpg" onclick="showPic(this); return false;" title="forth picture" >forth my favorite </a>
</li>
</ol>
<!--this the place to show pictures-->
<img id="placeholder" src="images/5.jpg" alt="place holder imga" />
</body>
</html>
JS:
function showPic(whichPic){
var source = whichPic.getAttribute("href");
var placeholder = document.getElementById("placeholder");
placeHolder.setAttribute("scr", source);
}
Which bit doesn’t work? First thing I noticed is that you have a spelling mistake when setting the placeholder’s attribute. you have scr when it should be src