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 相关文章推荐
33种Javascript 表格排序控件收集
Dec 03 Javascript
JavaScript中的isXX系列是否继续使用的分析
Apr 16 Javascript
javascript学习笔记(十三) js闭包介绍(转)
Jun 20 Javascript
JavaScript在IE和FF下的兼容性问题
May 19 Javascript
鼠标悬浮显示二级菜单效果的jquery实现
Oct 29 Javascript
浅析Javascript ES6新增值比较函数Object.is
Aug 24 Javascript
关于Function中的bind()示例详解
Dec 02 Javascript
浅谈$_FILES数组为空的原因
Feb 16 Javascript
小程序ios音频播放没声音问题的解决
Jul 11 Javascript
微信小程序自定义可滑动日历界面
Dec 28 Javascript
vue.js路由mode配置之去掉url上默认的#方法
Nov 01 Javascript
JQuery基于FormData异步提交数据文件
Sep 01 jQuery
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实现utf-8和GB2312编码相互转换函数代码
2013/02/07 PHP
解读PHP中上传文件的处理问题
2016/05/29 PHP
php生成微信红包数组的方法
2019/09/05 PHP
javaScript 判断字符串是否为数字的简单方法
2009/07/25 Javascript
Javascript attachEvent传递参数的办法
2009/12/14 Javascript
jquery获取div宽度的实现思路与代码
2013/01/13 Javascript
setInterval()和setTimeout()的用法和区别示例介绍
2013/11/17 Javascript
Ajax提交与传统表单提交的区别说明
2014/02/07 Javascript
jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证
2015/06/25 Javascript
Bootstrap每天必学之媒体对象
2015/11/30 Javascript
jQuery实现选项卡切换效果简单演示
2015/12/09 Javascript
基于BootStrap Metronic开发框架经验小结【八】框架功能总体界面介绍
2016/05/12 Javascript
js数组与字符串常用方法总结
2017/01/13 Javascript
原生JavaScript实现remove()和recover()功能示例
2018/07/24 Javascript
微信小程序 导入图标实现过程详解
2019/10/11 Javascript
详解vue页面首次加载缓慢原因及解决方案
2019/11/06 Javascript
微信小程序 wx:for 与 wx:for-items 与 wx:key的正确用法
2020/05/19 Javascript
JS 5种遍历对象的方式
2020/06/16 Javascript
vue实现lodop打印功能的示例
2020/11/11 Javascript
[06:53]2018DOTA2国际邀请赛寻真——勇于创新的Vici Gaming
2018/08/14 DOTA
[52:02]完美世界DOTA2联赛PWL S2 FTD.C vs SZ 第一场 11.27
2020/11/30 DOTA
Python实现批量下载图片的方法
2015/07/08 Python
PyCharm 设置SciView工具窗口的方法
2019/01/15 Python
python NumPy ndarray二维数组 按照行列求平均实例
2019/11/26 Python
python psutil监控进程实例
2019/12/17 Python
Pytest测试框架基本使用方法详解
2020/11/25 Python
经典c++面试题三
2015/07/08 面试题
新闻专业应届生求职信
2013/10/31 职场文书
2014年元旦感言
2014/03/06 职场文书
毕业生银行实习自我鉴定
2014/10/14 职场文书
2014年护士长工作总结
2014/11/11 职场文书
护理专业自荐信范文
2015/03/06 职场文书
2016母亲节感恩话语
2015/12/09 职场文书
2019银行竞聘书
2019/06/21 职场文书
前端学习——JavaScript原生实现购物车案例
2021/03/31 Javascript
《乙女游戏世界对路人角色很不友好》OP主题曲无字幕动画MV公开
2022/04/05 日漫