点击更改图像边框颜色两次答案

【问题标题】：Change Image Border Color Twice onclick点击更改图像边框颜色两次
【发布时间】：2014-11-02 08:11:36
【问题描述】：

我正在尝试更改图像边框颜色 onclick。首先，当用户单击图像时，图像边框颜色变为绿色，随后需要变为白色。以下是我的代码，如果我做错了什么，请告诉我。它始终显示白色图像边框颜色，从不显示绿色。

<div style="float:left;width:30%;">
 <img id="1" src="/images/37.jpg" width="163" height="100" alt="image not  displayed" onclick="openOnImageClick(this)" />
 <img id="2" src="/images/102.jpg" width="163" height="100" alt="image not displayed" onclick="openOnImageClick(this)" />
</div>

<script type="text/javascript">
function openOnImageClick(image)
{
 image.style.border = "3px solid green";

 // Some Ajax processing happens here

 image.style.border = "3px solid white"; 
}
</script>

【问题讨论】：

如果我可以给你例子但使用jquery版本可以吗？或者你更喜欢原生js
嗨Boye..我需要使用原生js

标签： javascript html image

【解决方案1】：

http://jsfiddle.net/tvf2mgje/

<div style="float:left;width:30%;">
     <img id="1" src="/images/37.jpg" width="163" height="100" alt="image not  displayed" onclick="openOnImageClick(this)" />
     <img id="2" src="/images/102.jpg" width="163" height="100" alt="image not displayed" onclick="openOnImageClick(this)" />
</div>

<script type="text/javascript">
    function openOnImageClick(image)
    {
        image.style.border = "3px solid green";

        // Some Ajax processing happens here

        setTimeout(function change ()
        {
            image.style.border = "3px solid white"
        }, 3000);
    }
</script>

【讨论】：