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截图20150721092858.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截图20150721092858.jpg')" style="margin-top: 300px; width: 200px; height: 100px; background-color: blue" />
29 </body>
30 </html>

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

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

转载于:https://www.cnblogs.com/itboy-2009/p/4663978.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/399945.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C++ 学习书目

C书单 第一篇 一些同学问我&#xff0c;如何学好C&#xff0c;我没有别的办法给你们&#xff0c;唯一的办法就是读书&#xff0c;读大量的书&#xff0c;就可以解决。要把C作为日常语言&#xff0c;而不是一种程序语言&#xff0c;这样就好办了。 有人又要问我&#xff0c;那么…

CentOS6.5安装配置

一、网络设置&#xff1a; 1、命令&#xff1a;vim /etc/sysconfig/network-scripts/ifcfg-eth0 DEVICEeth0 HWADDR00:0C:29:34:11:33 TYPEEthernet UUID6a0e083b-7d65-4afe-9d6f-f42f97659c89 ONBOOTyes NM_CONTROLLEDyes …

js踩过的一些坑

参考我的博客&#xff1a;http://www.isedwardtang.com/2017/08/29/js-bug/转载于:https://www.cnblogs.com/EdwardTang/p/7476769.html

开发中的几款小工具

文本编辑器 ckediter,kindediter,uediter比较多。 http://q.sohu.com/asset/group/ueditor/editor_all.js 马克鳗 用于: 截图测量&#xff0c;取颜色 代码比较工具 Beyond Compare sql书写智能提示工具 SQLPrompt sql自动提示,安装SQLPrompt工具options--->qualification---…

使用PDO总结

PHP使用PDO总结1、php.ini中开启PDO扩展&#xff1a; extensionphp_pdo.dll 重启Apache&#xff01; 2、PDO 构造方法 一共需要三个字段,分别为数据库配置信息&#xff0c;用户名&#xff0c;用户密码 其中数据库配置信息写法mysql:host192.16;post3306;charsetutf-8;dbnametes…

自己写的Python数据库连接类和sql语句拼接方法

python # SQL 查询语句sql "SELECT * FROM user where username %s" % username " and password %s" % password "" 参考&#xff1a; https://www.cnblogs.com/Xjng/p/3821827.html

注册表-显示回收站

WinXP系统下恢复不小心删掉的回收站图标&#xff01; 修改注册表法 1.单击“开始”\“运行”&#xff0c;在“打开”中键入“regedit”&#xff0c;运行注册表编辑器&#xff1b; 2.依次展开注册表至&#xff1a;HKEY&#xff3f;CURRENT&#xff3f;USER\Software\Microsoft\W…

自己如何获取ADO连接字符串

自己如何获取ADO连接字符串 摘自&#xff1a;http://blog.csdn.net/zyq5945/article/details/5586423 有时候我们参考网上的ADO连接字符串写未必就能连接上数据库。今天详细介绍下这个很流行的如何获取ADO字符串的方法&#xff0c;就能很容易直观看到这个连接字符串是否真能连接…

phpstorm+xdebug配置分享

一、选择XDEBUG扩展 xdebug下载地址&#xff1a;https://xdebug.org/download.php 注意&#xff1a;带"ts"是线程安全的意思&#xff0c;"nts"的他没有标示&#xff0c;也就是说&#xff0c;如果是nts的要下载没标示的&#xff0c;下载下来的文件名其实是有…

Flask框架Flask-Login用法分析

参考&#xff1a; https://www.cnblogs.com/cjnmy36723/p/5212047.html https://www.jianshu.com/p/06bd93e21945 Flask-Login插件中带了6种信号&#xff0c;可以基于其中的信号做一些额外工作&#xff0c;比如user_logged_in来记录用户的登录次数和登录IP等。 安装 ? 1 p…

spi驱动 (2):应用与测试

大幅度转载于:https://www.cnblogs.com/zhangyin-ethan/p/7481725.html

Mac安装PostgreSQL和测试安装结果

为什么80%的码农都做不了架构师&#xff1f;>>> 安装&#xff1a;brew install postgresql -v 这一步会安装它和它的各种依赖包&#xff0c;并且初始化元数据库内容添加到开机启动&#xff1a;ln -sfv /usr/local/opt/postgresql/*.plist ~/Library/LaunchAgents/ …

不可深交者

1&#xff1a;太过自私&#xff0c;不为他人考虑者&#xff0c;不可深交2&#xff1a;不讲诚信&#xff0c;多次爽约者&#xff0c;不可深交3&#xff1a;己过不该&#xff0c;屡劝屡犯者&#xff0c;不可深交4&#xff1a;不知感恩&#xff0c;过河拆桥者&#xff0c;不可深交…

MySQL--安装linux(5.6版本)

1 版本 目前MySQL数据库按用户群分为社区版(Community Server)和企业版(Enterprise/commercial)。--commercial授权版本 社区版是免费下载的&#xff0c;企业版需要付费且不能在线下载。 社区版分为3种&#xff1a; GA(General Availability)&#xff1a;官方推荐使用的版本&am…

linux命令行总结

简单命令 语法&#xff1a;#ls [路径] 表示列出指定路径下的文件夹和文件的名字&#xff0c;如果路径没有指定则列出当前路径下的语法&#xff1a;#ls -l [路径] 表示以列表的形式列出指定路径下的文件夹和文件的名字语法&#xff1a;#ls -la [路径] …

Flask-Session

https://pythonhosted.org/Flask-Session/

Andoid开发中生成二维码

2019独角兽企业重金招聘Python工程师标准>>> 第一步&#xff1a; 确定我们二维码的位置&#xff0c;即是在我们应用的哪个页面的哪个位置&#xff0c;简单讲就是用一个ImageView把二维码展示出来&#xff0c;我们就把二维码展示在下面布局activity_main.xml中的Imag…

Android中的onActivityResult和setResult方法的使用

$*********************************************************************************************$博主推荐&#xff1a;风萧兮兮易水寒&#xff0c;“天真”一去兮不复还。如何找到天真的那份快乐。小编倾力推荐app: 天真无谐下载方式&#xff1a;豌豆荚&#xff0c;应用宝…

单文件快速体验使用react输出hello_world

看了下react官方的hello world教程, 感觉对新手很不友好.codepen虽然好用, 但是封装太多东西, 看起来 太抽象. 还是喜欢像学习jQuery那样, 直接在单文件中引入必要的js文件, 然后直接运行的那种感觉. 如果使用VS Code, 建议安装Sublime Babel, 来提供对react语法的代码高亮. 基…

linux用户及权限操作

用户和用户组 说明&#xff1a;在Linux中只有超级管理员权限才能对用户和用户组进行设置&#xff0c;其他的用户一律没有权限设置&#xff1a; 用户管理 语法&#xff1a;#useradd 用户名 添加一个新用户 注&#xff1…