javascript动态改变img的src属性图片不显示的解决方法


Posted in Javascript onOctober 20, 2010

首先讲下这个bug的出现的情况,页面中有

<a href="javascript:void(0)" onclick="document.getElementById('current').src='images/001.jpg';">
这么一个a标签,onclick中的JS代码就是改变id为current的img标签的src属性,以达到动态切换图片的效果。可是不幸的是:IE是动态改变的图片的路径,但是图片却不显示出来,得右键“显示图片”才能看到改变后的图片,不知是什么原因,但据说是<a href="javascript:void(0)">或者<a href="#">这样使用a标签的话并不能阻止a标签最后触发一个什么行为,导致ie6会错误的认为页面刷新或者重定向了,并且中断了当前所有连接,这样新图片的加载就被aborted了(不知真假),不管原因是真是假,下面就先说下解决方案吧

简单的解决方法: 

<a href="javascript:void(0)" onclick="document.getElementById('current').src='images/001.jpg'; return false;">;

就是在代码后面加上return false;即可

Javascript 相关文章推荐
jquery lazyload延迟加载技术的实现原理分析
Jan 24 Javascript
高性能Javascript笔记 数据的存储与访问性能优化
Aug 02 Javascript
jquery select 设置默认选中的示例代码
Feb 07 Javascript
jQuery网页右侧广告跟随滚动代码分享
Apr 20 Javascript
JS实现页面中所有img对象添加onclick事件及新窗口查看图片的方法
Dec 27 Javascript
关于angular js_$watch监控属性和对象详解
Apr 24 Javascript
详解node HTTP请求客户端 - Request
May 05 Javascript
详解Webstorm 下的Angular2.0开发之路(图文)
Dec 06 Javascript
vue实现带复选框的树形菜单
May 27 Javascript
浅谈layui 表单元素的选中问题
Oct 25 Javascript
js中script的上下放置区别,Dom的增删改创建操作实例分析
Dec 16 Javascript
three.js 制作动态二维码的示例代码
Jul 31 Javascript
javascript奇异的arguments分析
Oct 20 #Javascript
超越Jquery_01_isPlainObject分析与重构
Oct 20 #Javascript
理解Javascript_15_作用域分配与变量访问规则,再送个闭包
Oct 20 #Javascript
理解Javascript_14_函数形式参数与arguments
Oct 20 #Javascript
理解Javascript_13_执行模型详解
Oct 20 #Javascript
用jquery与css打造个性化的单选框和复选框
Oct 20 #Javascript
Jquery插件之多图片异步上传
Oct 20 #Javascript
You might like
PHP在Web开发领域的优势
2006/10/09 PHP
一个可以找出源代码中所有中文的工具
2006/10/25 PHP
php表单提交与$_POST实例分析
2015/01/26 PHP
php实现简单的上传进度条
2015/11/17 PHP
PHP基于cookie与session统计网站访问量并输出显示的方法
2016/01/15 PHP
php接口实现拖拽排序功能
2018/04/23 PHP
php对mongodb的扩展(小试牛刀)
2012/11/11 Javascript
解析js中获得父窗口链接getParent方法以及各种打开窗口的方法
2013/06/19 Javascript
JavaScript 数组详解
2013/10/10 Javascript
理解Angular数据双向绑定
2016/01/10 Javascript
jQuery控制li上下循环滚动插件用法实例(附demo源码下载)
2016/05/28 Javascript
vue.js移动端app实战1:初始配置详解
2017/07/24 Javascript
在Js页面通过POST传递参数跳转到新页面详解
2017/08/25 Javascript
修改Nodejs内置的npm默认配置路径方法
2018/05/13 NodeJs
vue.js配合$.post从后台获取数据简单demo分享
2018/08/11 Javascript
js数组去重的方法总结
2019/01/18 Javascript
JS面向对象编程基础篇(三) 继承操作实例详解
2020/03/03 Javascript
jQuery+Ajax+js实现请求json格式数据并渲染到html页面操作示例
2020/06/02 jQuery
python中is与双等于号“==”的区别示例详解
2017/11/21 Python
pandas 取出表中一列数据所有的值并转换为array类型的方法
2018/04/11 Python
Pytorch 之修改Tensor部分值方式
2019/12/27 Python
彻底搞懂 python 中文乱码问题(深入分析)
2020/02/28 Python
2020最新pycharm汉化安装(python工程狮亲测有效)
2020/04/26 Python
Python实现随机爬山算法
2021/01/29 Python
HTML5中如何显示视频呢 HTML5视频播放demo
2013/06/08 HTML / CSS
英国运动服、设备及配件网站:DW Sports
2019/12/04 全球购物
C#实现启动一个进程
2016/10/01 面试题
资深地理教师自我评价
2013/09/21 职场文书
中学生自我鉴定
2014/02/04 职场文书
军校大学生个人的自我评价
2014/02/17 职场文书
革命英雄事迹演讲稿
2014/09/13 职场文书
三八节祝酒词
2015/08/11 职场文书
三好学生竞选稿范文
2019/08/21 职场文书
关于Javascript闭包与应用的详解
2021/04/22 Javascript
如何用PHP实现分布算法之一致性哈希算法
2021/05/26 PHP
MySQL中几种插入和批量语句实例详解
2021/09/14 MySQL