日期:2014-05-19  浏览次数:20446 次

关于<img>和js的问题2,关于样式,在线等!!!
http://community.csdn.net/Expert/topic/5487/5487961.xml?temp=.6246454
上面的问题多谢大家帮忙,已经结贴

<img   src= " <%#Eval( "photo ")   %> "     onclick= "javascript:getElementById( 'imgShow ').src=this.src "   />

<img   id= "imgShow "   />

现在有个新的问题,如何在onclick事件里再上控制,使当前点击得图片处于选中状态,如把imgShow的border变为1(或者别的方法)
当点击其他图片的时候所有未被点击的图片就处于未选中状态border为0(或者别的方法)

这样的功能如何实现???


------解决方案--------------------
如果多个img,id为imgShow1,imgShow2.....
<img src= " <%#Eval( "photo ") %> " onclick= "test( 'imgShow1 ') " />

function test(id)
{
for(var i=1;i <5;i++)
{
var img =document.getElementById( "imgShow "+i);
if(img)
{
img.style.borderWidth = "0 ";
}
}
document.getElementById(id).style.borderWidth = "1px ";
}
------解决方案--------------------
用一个全局变量记录被点击的img的id,假设为preId
发生img的click事件作以下动作
1.改变img的样式,如getElementById( 'imgShow ').className= 'imgSelect '
2.将Id为preId的img的样式改回来
3.将当前img的Id赋给preId
------解决方案--------------------
function showimg(obj)
{
document.getElementById( 'imgShow ').src = obj.src;
for(var i = 0;i < document.images.length;i++)
{
document.images[i].style.borderWidth = '0 ';

}
obj.style.borderWidth = '1 ';
obj.style.borderStyle = "solid "
obj.style.borderColor = "red "
}

------解决方案--------------------
img的onclick= "showimg(this); "

function showimg(img)
{
for(var i = 0;i < document.form1.elements.length;i++)
{
if(document.form1.elements[i].type == "img ")
document.form1.elements[i].style.border = '0 ';
}
img.style.border = '1 ';
}

试试