单击事件 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Image Guess</title>
    <style>
        body{
            margin: 20px;
        }
        img {
            margin: 20px;
        }

    </style>
    <script>
        window.onload = init;
        function init(){
            var images = document.getElementsByTagName("img");
            for (var i = 0; i < images.length; i++){
                images[i].onclick = showAnswer;
            }
        }

        function showAnswer(eventObj){
            var image = eventObj.target;
            var name = image.id;
            name = name + ".jpg";
            image.src = name;
            setTimeout(reblur, 2000, image);
        }

        function reblur(image){
            var name = image.id;
            name = name + 'blur.jpg';
            image.src = name;
        }

    </script>
</head>
<body>
    <img id="zero" src="zeroblur.jpg">
    <img id="one" src="oneblur.jpg">
    <img id="two" src="twoblur.jpg">
    <img id="three" src="threeblur.jpg">
    <img id="four" src="fourblur.jpg">
    <img id="five" src="fiveblur.jpg">

</body>
</html>

 

posted @ 2018-07-20 10:08  道高一尺  阅读(145)  评论(0)    收藏  举报