码迷,mamicode.com
首页 > Web开发 > 详细

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

时间:2015-07-21 12:11:22      阅读:131      评论:0      收藏:0      [点我收藏+]

标签:

使用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截图20150721092858.jpg" onmouseout="hiddenPic()" onmousemove="showPic(this.src)" title="wowowowo" style="margin-top: 300px" />
28     <div onmouseout="hiddenPic()" onmousemove="showPic(‘pic/QQ截图20150721092858.jpg‘)" style="margin-top: 300px; width: 200px; height: 100px; background-color: blue" />
29 </body>
30 </html>

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

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

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

标签:

原文地址:http://www.cnblogs.com/itboy-2009/p/4663978.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!