为了账号安全,请及时绑定邮箱和手机立即绑定

JavaScript中onclick函数return false 未被触发是怎么回事?

JavaScript中onclick函数return false 未被触发是怎么回事?

猛跑小猪 2018-07-22 13:26:12
按照javascript dom 编程艺术关于网页显示图片的那部分内容敲出来的代码,其中有一段需要输入onclick="showPic(this);return false;"用于阻止网页弹出新的链接来查看图片,但是最后运行的时候还是弹出新的链接了,具体代码如下:<!DOCTYPE html> <html lang="en"> <head>   <meta charset="utf-8"/>   <title>My Gallery</title> </head> <body>   <h1>snapshots</h1>   <ul>     <li>     <a href="images/do or die.jpg" onclick="showPic(this);return false;" title="do or die">DO</a>     </li>     <li>     <a href="images/hand.jpg" onclick="showPic(this);return false;" title="hand">HAND</a>     </li>     <li>     <a href="images/phrase.jpg" onclick="showPic(this);return false;" title="phrase">Phrase</a>     </li>   </ul>   <img id="placeholder" src="images/dog.jpg" alt="My Gallery"/>   <script>   function showPic(whichpic)   {var source=whichpic.getAttribute ("href");   var placeholder=document.getElenmentById ("placeholder");   placeholder.setAttribute("src",source);}   </script> </body> </html>
查看完整描述

2 回答

?
慕标琳琳

TA贡献1830条经验 获得超9个赞

首先是你的id获取单词都拼错了,其次是a标签href指向问题和点击事件冲突
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>My Gallery</title>
</head>
<body >
<h1>snapshots</h1>
<ul>

<li> <a href="javascript:;" date-href="zhc1.jpg" onclick="showPic(this);return false;" title="do or die">DO</a> </li> <li> <a href="javascript:;" date-href="zhc2.jpg" onclick="showPic(this);return false;" title="hand">HAND</a> </li> <li> <a href="javascript:;" date-href="zhc3.jpg" onclick="showPic(this);return false;" title="phrase">Phrase</a> </li>

</ul>
<img id="placeholder" src="zixun_video_pic.jpg" alt="My Gallery"/>
<script>

  function showPic(whichpic){     var source=whichpic.getAttribute ("date-href");     var placeholder=document.getElementById ("placeholder");        placeholder.setAttribute("src",source); }

</script>
</body>
</html>


查看完整回答
反对 回复 2018-07-29
?
慕工程0101907

TA贡献1887条经验 获得超5个赞

获取id是document.getElementById('')

查看完整回答
反对 回复 2018-07-29
  • 2 回答
  • 0 关注
  • 928 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信