Javascript - onclick event not working twice

X-Received	by 10.140.176.75 with SMTP id w72mr13837943qhw.30.1465237334237; Mon, 06 Jun 2016 11:22:14 -0700 (PDT)
X-Received	by 10.157.4.36 with SMTP id 33mr204939otc.15.1465237334199; Mon, 06 Jun 2016 11:22:14 -0700 (PDT)
Path	csiph.com!usenet.blueworldhosting.com!feeder01.blueworldhosting.com!peer03.iad.highwinds-media.com!news.highwinds-media.com!feed-me.highwinds-media.com!p34no3434146qgp.1!news-out.google.com!107ni11qgx.1!nntp.google.com!q32no4453817qgq.0!postnews.google.com!glegroupsg2000goo.googlegroups.com!not-for-mail
Newsgroups	comp.lang.javascript
Date	Mon, 6 Jun 2016 11:22:13 -0700 (PDT)
Complaints-To	groups-abuse@google.com
Injection-Info	glegroupsg2000goo.googlegroups.com; posting-host=101.212.65.3; posting-account=wAfAfgkAAACHz0UlxjsX7YiXJMvcVSYE
NNTP-Posting-Host	101.212.65.3
User-Agent	G2/1.0
MIME-Version	1.0
Message-ID	<2bebddfb-a511-4c09-8f42-e4e8bd0525f8@googlegroups.com> (permalink)
Subject	Javascript - onclick event not working twice
From	Mohit Bajoria <mohitbajo36@gmail.com>
Injection-Date	Mon, 06 Jun 2016 18:22:14 +0000
Content-Type	text/plain; charset=UTF-8
X-Received-Bytes	3709
X-Received-Body-CRC	1485028537
Xref	csiph.com comp.lang.javascript:30637

Show key headers only | View raw

Hello developers 
There is a simple game in which after one onclick event is fired, second one is not working 
I am pasting the code and u can use any image with name 'smile.png' 

<!DOCTYPE html>
<html>
    <head>
        <style>
            img {position: absolute;}
            div {position: absolute; width:500px; height:500px}
            #rightSide { left: 500px; border-left: 1px solid black; }
        </style>
    </head>
    <body>
        <h1>Matching Game</h1>
        Click on the extra smiling face on the left.
        <div id="leftSide"></div>
        <div id="rightSide"></div>
        
        <script>
            var numberOfFaces = 5;
            var i;
            var theLeftSide = document.getElementById("leftSide");
            var theRightSide = document.getElementById("rightSide");
            var theBody = document.getElementsByTagName("body")[0];
            var leftSideImages;
            document.getElementsByTagName("body").onload = generateFaces();
            
            function generateFaces(){
                
                for(i=0;i<numberOfFaces; i++){
                    var image=document.createElement("img");
                    image.src="smile.png";
                    image.style.top=Math.floor(Math.random()*400)+"px";
                    image.style.left=Math.floor(Math.random()*400)+"px";
                    theLeftSide.appendChild(image);
                    
                }
                leftSideImages = theLeftSide.cloneNode(true);
                leftSideImages.removeChild(leftSideImages.lastChild);
                theRightSide.appendChild(leftSideImages);
                return 0;
                
            }
            theLeftSide.lastChild.onclick = function nextLevel(event){
                        event.stopPropagation();
                        
                        numberOfFaces += 5;
                        while(theLeftSide.firstChild){
                            theLeftSide.removeChild(theLeftSide.firstChild);
                        }
                        while(theRightSide.firstChild){
                            theRightSide.removeChild(theRightSide.firstChild);
                        }
                        
                        generateFaces();
                        
            }
            
            theBody.onclick = function gameOver() {
                        
                        alert("Game Over!");
                        theBody.onclick = null;
                        theLeftSide.lastChild.onclick = null;
            } 
                
        </script>
    </body>
</html>

Please help out guys

Thanks
Mohit

Back to comp.lang.javascript | Previous | Next — Next in thread | Find similar | Unroll thread

Thread

Javascript - onclick event not working twice Mohit Bajoria <mohitbajo36@gmail.com> - 2016-06-06 11:22 -0700
  Re: Javascript - onclick event not working twice JJ <jj4public@vfemail.net> - 2016-06-07 13:53 +0700

csiph-web