各位大侠!我的img 中 <img name="b" id="b" src="img/soft1.jpg" width="90" height="29" border="0" switchImage="img/soft11.jpg" srcImage="img/soft1.jpg" tabindex="14" /> 放2个图片,加载页面时,显示src的图片,点击时,显示switchImage的图片。那么我在js 中 这样写:
var selImgobj=document.getElementById("b");
if(selImgobj.getAttribute("switchImage") !=null)
{
selImgobj.setAttribute("src",selImgobj.getAttribute("switchImage"));
// alert(selImgobj.src);
}
但是这样点击时,图片显示为空,要选择鼠标右键的显示图片,才可以显示。
如果我用alert(selImgobj.src);是可以显示图片的,请问这样什么原因,如何解决?
需要重新创建img 的dom
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script>
function s() {
var selImgobj=document.getElementById("b"); if(selImgobj.getAttribute("switchImage") !=null)
{
//selImgobj.setAttribute("src",selImgobj.getAttribute("switchImage"));
selImgobj.outerHTML = '<img name="b" id="b" src="' + selImgobj.getAttribute("switchImage") + '" width="90" height="29" border="0" switchImage="img/soft11.jpg" srcImage="img/soft1.jpg" tabindex="14" onclick="s()"/>';
// alert(selImgobj.src);
}
}
</script>
</head><body>
<img name="b" id="b" src="img/soft1.jpg" width="90" height="29" border="0" switchImage="img/soft11.jpg" srcImage="img/soft1.jpg" tabindex="14" onclick="s()"/>
</body>
</html>
innerHTML,createElement也是可以的
1.通过AlphaImageLoader可以实现
2.先将图片缓存到一个子页面中,然后将页面的Image控件的src指向该页面显示子页面即可达到这种效果。
IE6和IE7是有这种问题发生,IE8已经解决了这个问题,你可以去尝试一下上面的两种方法
谢谢各位大侠。还是散分给你们吧。