使用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使用双引号、单引号的时候应该注意的问题的更多相关文章

  1. 关于js中单双引号以及转义符的理解

    关于js中单引号(')和双引号(")的使用以及转义的理解 这几天一直在画页面,身为开发人员的我之所以要画页面是因为当前项目中的页面上所有的东西都是从数据库中取得的,也就是动态的,类似于我们设 ...

  2. Js参数值中含有单引号或双引号解决办法

    <script type="text/javascript"> function Display(LoginEmail, UserName, ID) {         ...

  3. 输出到网页前台js代码中包含单引号的处理方法

    描述:后台输出js到前台,如     <script type="text/javascript">   //<![CDATA[       var aStepD ...

  4. html & js 单双引号

    1.html使用双引号,嵌套亦如此,表示dom元素的属性 <input value="Test" type="button" onclick=" ...

  5. js单双引号

    JavaScript单双引号的使用没有严格的要求,单独出现的时候,用单用双都可以的,但是如果一起出现的话就要严格区分了

  6. 在js里双引号里又加单引号的解决方案常用WdatePicker

    EndTime: '<input name="EndTime" type="text" class="editable center decim ...

  7. js去掉双引号

    替换: d = d.replace("\"","").replace("\"",""); 全部替换: ...

  8. HTML通过事件传递参数到js 二 event

    原文链接http://blog.sina.com.cn/s/blog_8a18c33d010172pp.html event用例: <!DOCTYPE html><html>& ...

  9. asp.net 调用前台JS调用后台，后台掉前台JS

    C#前台js调用后台代码前台js<script type="text/javascript" language="javascript"> func ...

随机推荐

  1. jQuery Wookmark 瀑布流布局

    瀑布流布局非常适合大量图片的展示,一改过去裁剪图片尺寸统一的排版,每张图片都能完全展示,并错落有致,让人眼前一亮. 版本: jQuery v1.4.3+ jQuery Wookmark Load v1 ...

  2. Angular学习（4）- 数组双向梆定

    示例: <!DOCTYPE html> <html ng-app="MyApp"> <head> <title>Study 4< ...

  3. UIDatePicker自定义背景

    selectDatePicker = [[UIDatePicker alloc]init];    selectDatePicker.frame = CGRectMake(0, 10, 280, 21 ...

  4. Python基础教程【读书笔记】 - 2016/7/24

    希望通过博客园持续的更新,分享和记录Python基础知识到高级应用的点点滴滴! 第九波:第9章  魔法方法.属性和迭代器  在Python中,有的名称会在前面和后面都加上两个下划线,这种写法很特别.已 ...

  5. 学习C++11的一些思考和心得(1):lambda,function,bind和委托

     1.lambda表达式 lanbda表达式简单地来讲就是一个匿名函数,就是没有名称的函数,如果以前有接触过python或者erlang的人都比较熟悉这个,这个可以很方便地和STL里面的算法配合 st ...

  6. 很励志的帖子，转来自勉，也反省一下自己写码这几年【奋斗10年，一个.NET程序员从0到拥有5系】

    http://bbs.csdn.net/topics/390833230 想想自己毕业近8年,真正写码也5年.从当初毕业时的拒绝写码,到迫不得已开始写码,是命运也好,是自己的不努力也罢.今天看来,写码 ...

  7. [platform]新旧内核的device设备注册对比

    转自:http://blog.chinaunix.net/uid-7332782-id-3268801.html 1. Version2.6内核启动过程 start_kernel( ) //板子上电启 ...

  8. Javascript之UI线程与性能优化

    在浏览器中,Javascript执行与UI更新是发生在同一个进程(浏览器UI线程)中的.UI线程的工作基于一个简单的队列系统,任务会被保存到队列中直到进程空闲时被提取出来执行.所以Javascript ...

  9. (C/C++) Interview in English - Class

    Q: What is a class? A: A class is an expanded concept of a data structure: instead of holding only d ...

  10. PLSQL_Database Link的基本概念和用法（概念）

    2014-06-08 Created By BaoXinjian