解决javascript动态改变img的src属性图片不显示问题
首先讲下这个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了(不知真假),不管原
因是真是假,下面就先说下解决方案吧
简单的解决方法:
1、<a href="javascript:void(0)" onclick="document.getElementById('current').src=‘images/001.jpg’; return false;“
>;就是在代码后面加上return false;即可
2、把A换成SPAN等
问题代码
function getNewCaptcha(obj, ct){
var oImg = obj.getElementsByTagName('img')[0];
var capId = obj.getElementsByTagName('input')[0].value;
if(!capId){
capId = genCapId(obj, ct);
}
if(capId){
oImg.src = '/captcha?c=' + capId + '&r=' + Math.random();
oImg.style.display = 'block';
oImg.onerror = function(){
imgError(oImg);
}
obj.onclick = function(){
getNewCaptcha(obj);
return false;
}
}else{
imgError(oImg);
}
}
15行为新加的return false,加上以后IE6就OK了
解决javascript动态改变img的src属性图片不显示问题的更多相关文章
- ie6下使用js替换img标签src属性图片不显示的错误
首先,我必须再次强调一下,F-U-C-K I-E! 其次,简单阐述一下这个bug的出现的情况.页面中有个<a href=”javascript:void(0)” onclick=”swapImg ...
- javascript动态改变iframe的src
页面中需要动态的改变iframe的地址,方法有: 1. window.frames["chartFrame"].document.location = "<%=ba ...
- javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行
jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...
- easyui如何动态改变列的编辑属性
动态改变列的编辑属性 var tt=$('#dg').datagrid('getColumnOption', 'yearContent'); //通过列名获得此列 tt.editor={type:'t ...
- JavaScript动态改变表格单元格内容的方法
本文实例讲述了JavaScript动态改变表格单元格内容的方法.分享给大家供大家参考.具体如下: JavaScript动态改变表格单元格的内容,下面的代码通过修改单元格的innerHTML来修改单元格 ...
- js动态改变img元素src在IE无效的问题
做了个验证码功能,需要做个点击改变验证码图片的功能,使用js改变img的src,代码如下 $("#cerificationCodeImg").attr("src" ...
- 解决js动态改变dom元素属性后页面及时渲染问题
今天实现一个进度条加载过程,dom结构其实就是两个div <div class="pbar"> <div class="ui-widget-header ...
- javascript 动态改变onclick事件
第一种:button.onclick = Function("alert('hello');"); 第二种:button.onclick = function(){alert(&q ...
- javascript动态改变当前页面中元素的状态行为
function Datea() { var timed = document.getElementById('timed'); var t = setInterval(function TDate( ...
随机推荐
- make命令以及makefile
make命令以及makefile使用RCS与CVS进行源代码控制编写手册页使用patch与tar发布软件开发环境 多源代码的问题 当我们编写小程序时,许多人都是简单的在编辑后通过重新编译所有的文件重新 ...
- ASP.NET 发布到IIS后支撑woff 的解决方案
<system.webServer> <staticContent> <remove fileExtension=".woff" ...
- Autumn is a second spring when every leaf is a flower.
Autumn is a second spring when every leaf is a flower. 秋天即是第二个春天,每片叶子都是花朵.——阿尔贝·加缪
- HTML转移字符对照表
body { margin: 0; padding: 0; background: #FFF; color: #000; font-family: "宋体", arial; fon ...
- 《编写可维护的JavaScript》——JavaScript编码规范(五)
语句和表达式 在JavaScript中,诸如if和for之类的语句有两种写法,使用花括号的多行代码或者不使用花括号的单行代码.比如: //不好的写法,尽管这是合法的JavaScript代码 if (c ...
- SQLServer控制用户访问权限表
连接地址:http://www.cnblogs.com/yxyht/archive/2013/03/22/2975880.html 一.需求 在管理数据库过程中,我们经常需要控制某个用户访问数据库的权 ...
- 位图切割器&位图裁剪器
位图切割器: 虽然网上有类似的工具,PhotoShop 也有类似功能,但前者似乎不支持超大位图切割(以 G 计大小),而后者的切割块数量好像有比较小的限定范围,于是自己动手写了这个工具. 至于为什么是 ...
- R语言基本操作函数---变量的基本操作
1.变量变换 as.array(x),as.data.frame(x),as.numeric(x),as.logical(x),as.complex(x),as.character(x) ...
- Cheatsheet: 2016 03.01 ~ 03.31
JAVA Quick Java 8 or Java 7 Dev Environments With Docker Printing arrays by hacking the JVM Mobile H ...
- C++知识库
C++知识库 秒杀多线程 .