麻烦帮看下哪里出了问题,谢谢
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Image Gallery</title>
<link rel="stylesheet" type="text/css" href="css/index.css">
</head>
<body>
<h1>Snapshots</h1>
<div class="image-box">
<ul id="imageGallery">
<li><a href="images/3.jpg" title="鞋子">鞋子</a></li>
<li><a href="images/5.jpg" title="行李箱">行李箱</a></li>
<li><a href="images/7.jpg" title="手机">手机</a></li>
<li><a href="images/11.jpg" title="体恤衫">体恤衫</a></li>
</ul>
<!-- <img id="placeholder" src="images/course5.jpg" alt="my Image Gallery"/> -->
</div>
<!-- <p id="description">Choose an image.</p> -->
<script type="text/javascript" src="js/index.js"></script>
</body>
</html>
// 以下代码那里错误?
function addLoadEvent(func){
var oldload=window.onload;
if(typeof window.onload!="function"){
window.onload=func;
}else{
window.onload=function(){
oldload();
func();
}
}
}
function preparePlaceholder(){
if(!document.createElement) return false;
if(!document.createTextNode) return false;
if(!document.getElementById) return false;
if(!document.getElementById("image-box")) return false;
var placeholder=document.createElement("img");
placeholder.setAttribute("id","placeholder");
placeholder.setAttribute("src","images/course5.jpg");
placeholder.setAttribute("alt","my Image Gallery");
var imageBox=document.getElementById("image-box");
imageBox.appendChild(placeholder);
var description=document.createElement("p");
description.setAttribute("id","description");
var txt=document.createElement("Choose an image.");
description.appendChild(txt);
document.body.appendChild(description);
}
function prepareGallery(){
if(!document.getElementById) return false;
if(!document.getElementsByTagName) return false;
if(!document.getElementById("imageGallery")) return false;
var imageGallery=document.getElementById("imageGallery");
var aLinks=imageGallery.getElementsByTagName("a");
for(var i=0;i<aLinks.length;i++){
aLinks[i].onclick=function(){
//showPic(this);
// console.log(this);
return showPic(this) ? false:true;
}
//aLinks[i].onkeypress=aLinks[i].onClick;
}
}
//addLoad Event(prepareGallery);
function showPic(whichpic){
if(!document.getElementById("placeholder")) return false;
var source=whichpic.getAttribute("href");
var placeholder=document.getElementById("placeholder");
placeholder.setAttribute("src",source);
if(document.getElementById("description")){
var text=whichpic.getAttribute("title")? whichpic.getAttribute("title"):"",
description=document.getElementById("description");
if(description.firstChild.nodeType==3){
description.firstChild.nodeValue=text;
}
}
return true;//如果description存在,它将会被更新,否则会忽略。
// window.onload=countBodyChild();//每点击一次,弹出一次;
//countBodyChild();//每点击一次,弹出一次;
}
addLoadEvent(preparePlaceholder);
addLoadEvent(prepareGallery);
body{
padding:30px 0 0 100px;
}
ul,li{
list-style-type: none;;
}
li{
display:inline-block;
margin-right:50px;
}
a{
text-decoration:none;
color:#900;
font-weight: bold;
font-size:16px;
}
p{
font-size:20px;
font-weight:bold;
}
我想实现的是点击li中的文字后,动态的创建出placeholder对象和description对象,并将li中a连接的图片显示到place holder中,将a链接的title属性中的文字显示到description中,麻烦帮我看看为什么,我一点击a链接就跳转到新的页面打开图片了。