600字范文,内容丰富有趣,生活中的好帮手!
600字范文 > onmousemove和onmouseout事件的调用 和js使用双引号 单引号的时候应该注意的问题...

onmousemove和onmouseout事件的调用 和js使用双引号 单引号的时候应该注意的问题...

时间:2019-08-30 16:20:48

相关推荐

onmousemove和onmouseout事件的调用 和js使用双引号 单引号的时候应该注意的问题...

使用js的时候,统一使用双引号,然后通过反斜杠进行转义

①如果同时使用单引号、和双引号的情况下容易出现问题,导致标签中表示的事件不能调用,

②导致由于标签没有封口而出现样式布局错误

1 <!DOCTYPE html> 2 <html> 3 <head> 4<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 5<title>JS教程:鼠标悬停时显示文字或显示图片</title> 6<script type="text/javascript"> 7 function showPic(sUrl) { 8 alert(sUrl); 9 var x, y;10 x = event.clientX;11 y = event.clientY;12 document.getElementById("Layer1").style.left = (x - 60).toString() + "px";13 document.getElementById("Layer1").style.top = (y - 100).toString() + "px";14 document.getElementById("Layer1").innerHTML = "<img src=\"" + sUrl + "\">";15 document.getElementById("Layer1").style.display = "block";16 }17 function hiddenPic() {18 document.getElementById("Layer1").innerHTML = "";19 document.getElementById("Layer1").style.display = "none";20 }21</script>22 </head>23 <body>24<div style="position: relative">25 <div id="Layer1" style="display: none; position: absolute; z-index: 1;"></div>26</div>27<img src="pic/QQ截图0721092858.jpg" οnmοuseοut="hiddenPic()" οnmοusemοve="showPic(this.src)" title="wowowowo" style="margin-top: 300px" />28<div οnmοuseοut="hiddenPic()" οnmοusemοve="showPic('pic/QQ截图0721092858.jpg')" style="margin-top: 300px; width: 200px; height: 100px; background-color: blue" />29 </body>30 </html>

对于上述代码,如果ShowPic中的内容,没有使用单引号括起来的情况下,那么将会导致无法调用showPic,因为如果不使用单引号的情况下就会导致将其解析为表达式

注意其中的onmousemove和onmouseout事件的使用

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。