为何每次点击之后不会在下面替换掉图片,而是跳出来一个新的页面,貌似prepareGallery()函数没有被调用
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<title>let's do it</title>
<link rel = "stylesheet" href = "D1css.css" media = "screen" />
</head>
<body>
<h1>picture</h1>
<ul id = "imagegallery">
<li>
<a href = "img/tlswft.jpg" title = "my lady">泰勒斯威夫特</a>
</li>
<li>
<a href = "img/arpxn.jpg" title = "god father">阿尔帕西诺</a>
</li>
<li>
<a href = "img/wolf1.jpg" title = "wolf">狼</a>
</li>
<li>
<a href = "img/xslj.jpg" title = "clown" >希斯莱杰</a>
</li>
</ul>
<img id = "placeholder" src = "img/bai.jpg" alt = "my image gallery"/>
<p id = "description">choose your img</p>
<script src = DOM1.js></script>
</body>
</html>
/**
* Created by kaka on 2017/3/30.
*/
function prepareGallery() {
if (!document.getElementsByTagName()) return false;
if (!document.getElementById()) return false;
if (!document.getElementById("imagegallery")) return false;
var gallery = document.getElementById("imagegallery");
var links = gallery.getElementsByTagName("a");
for (var i = 0; i < links.length; i++) {
links[i].onclick = function () {
return showPic(this);
}
}
}
function sss() {
alert(dwadwadwad);
}
function showPic(whichpic) {
if (!document.getElementById("placeholder")) return false;
var source = whichpic.getAttribute("href");
var placeholder = document.getElementById("placeholder");
if (placeholder.nodeName != "IMG") return false;
placeholder.setAttribute("src", source);
if (document.getElementById("description")) {
var text = whichpic.getAttribute("title") ? whichpic.getAttribute("title") : "";
var description = document.getElementById("description");
if (description.firstChild.nodeType == 3) {
description.firstChild.nodeValue = text;
}
}
return true;
}
大概把你要的效果整出来了 不过你的代码 有很多东西要改 prepareGallery这个方法里的第二三行代码放在chrome里会报错,影响继续往下执行(我不知道你用的啥,自己看控制台,如果有错就注释掉) 另外,你的这个方法根本就没执行,我看不到你在哪里调的,
window.onload = function(){
prepareGallery();
};
我自己写进onload调了 你也可以用jquery的
还有一件事,showPic方法的返回值改为false,不然a标签会打开新的页面
有点不太懂你那个方法里的前两行啥意思 ,调用的getdocumentsByTagName什么的 也没有参数,不报错吗 而且如果undefined再 !一下 不就直接return false返回了吗
嗯 也可能 我说的不对。。