html - Moving inline event handlers to javascript sheet for chrome extension -
i creating chrome extension of tic tac toe game. however, html code has inline event handlers not allowed because of content security. need figure out how transfer these event handlers javascript page.
this html page, inline event handlers in buttons , call function gamestart:
<head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <link href="game.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="singleplayer.js"></script> </head> <body> <center><u><h1>single player mode</h1></u> <table> <tr><td> <button style="background-color:lightblue ; color: black" id="0" onclick = "gamestart(0)"> </button></td> <td> <button style="background-color:lightblue ; color: black" id="1" onclick = "gamestart(1)"> </button> </td><td> <button style="background-color:lightblue ; color: black" id="2" onclick = "gamestart(2)"> </button> </td></tr> <tr><td> <button style="background-color:lightblue ; color: black" id="3" onclick = "gamestart(3)"> </button> </td><td> <button style="background-color:lightblue ; color: black" id="4" onclick = "gamestart(4)"> </button> </td><td> <button style="background-color:lightblue ; color: black" id="5" onclick = "gamestart(5)"> </button> </td></tr><tr><td> <button style="background-color:lightblue ; color: black" id="6" onclick = "gamestart(6)"> </button> </td><td> <button style="background-color:lightblue ; color: black" id="7" onclick = "gamestart(7)"> </button> </td><td> <button style="background-color:lightblue ; color: black" id="8" onclick = "gamestart(8)"> </button> </td></tr></table></center> </body> </html> on javascript sheet, here function called using event handlers:
var counter=0; function gamestart(id){ console.log(id); counter=counter+2 if(counter%1==0){ document.getelementbyid(id).innerhtml = "x"; checkx("x"); stopbutton("x"); settimeout('player2()',500); checktie(); } }
document.onclick = function (event) { if (event.target.nodename === 'button') { gamestart(event.target.id); } } 
Comments
Post a Comment