onclick优化问题
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<style type="text/css">
#box{
width: 300px;
height: 300px;
}
</style>
<script type="text/javascript">
window.onload = function () {
var ull =document.getElementById('ull');
var as =ull.getElementsByTagName('a');
for (var i = 0; i < as.length; i++) {
as[i].onclick =function () {
pic(this);
return false;
}
}
}
function pic(x) {
var herfs = x.getAttribute('href');
var imgs = document.getElementById('box');
imgs.setAttribute('src', herfs);
var ti = document.getElementById('ti');
var text = x.getAttribute('title');
ti.innerHTML = text;
}
</script>
<body>
<ul id="ull">
<li><a href="http://h.hiphotos.baidu.com/zhidao/pic/item/6d81800a19d8bc3ed69473cb848ba61ea8d34516.jpg" title="a">go1</a></li>
<li><a href="http://www.33lc.com/article/UploadPic/2012-8/201282413335761587.jpg" title="b">go2</a></li>
</ul>
<img src="http://img.boqiicdn.com/Data/BK/A/1607/25/imagick14651469425193_y.jpg" alt="pic" id="box">
<p id="ti">title</p>
</body>
</html>点击时调用pic（this），return false取消跳转。没问题，书上说优化onclick，如下
as[i].onclick =function () {
if (pic(this)) {
return false;
} else {
return true;
}
}我觉也没问题成立链接不跳转，不成立跳转。可运行和之前的不一样，变成跳转了，为什么？
啊啊啊啊123浏览 1384回答 2
2回答
-
hahhhha
pic方法需要return返回值，才能判断。window.onload = function () { var ull =document.getElementById('ull'); var as =ull.getElementsByTagName('a'); for (var i = 0; i < as.length; i++) { as[i].onclick =function () { pic(this); } } } function pic(x) { return false; var herfs = x.getAttribute('href'); var imgs = document.getElementById('box'); imgs.setAttribute('src', herfs); var ti = document.getElementById('ti'); var text = x.getAttribute('title'); ti.innerHTML = text; } -
stone310
if (pic(this)) 这么写，相当于if(undefined)，因为pic(this)是执行函数的意思，而你这个函数并没有返回值，所以会undefind，在if判断里也就是false；因此函数后面不能加括号，只调用函数名，if(pic)，除非你的函数最后有返回值(return xxx)，就会返回你的返回值
随时随地看视频慕课网APP
相关分类
JavaScript