You need to be logged in to post in the forums. If you do not have an account, please sign up first.
javascript doesn't change td's innerHTML at certain times
link to the page with this codei am almost done with my javascript tictactoe
but the place() function will work in everything but Opera (i've tried in iphone opera, win7 opera 10.10 and win7 opera 10.51)
i have checked the error console and there are no errors
i have put alert()s in saying what part of the code it's executing, and its functions as it should
i have tried changing the ids of the tds(used as the board) so that they dont contain numbers and it acts the same
i have tried changing place(id) to document.getElementById('id').innerHTML=Oid; and document.getElementById(id).innerHTML=Oid;, still nothing
it won't change the innerHTML anywhere where place() is called
<script type="text/javascript" language="javascript">
var xmove=true;
var players="<?php
if (strlen(stristr($agent, 'opera'))>0) print "1";else print"2";?>";//2 player selected as default in Opera until 1 player works
var dif="easy";
var end=false;
var owins=0;
var xwins=0;
var Oid="O";
var Xid="X";
var draws=0;
function changenumplayers(sel)
{
if (sel.value=="1")
{
document.getElementById('compdif').innerHTML="<select name='changedif' style=\"height:24px;\" onchange='changedif(this)'><option value='easy' style=\"height:14px;\">Easy</option><option value='medium' style=\"height:14px;\">Medium</option><option style=\"height:14px;\" value='hard'>Hard</option><option style=\"height:14px;\" value='omgwtf'>OmgWTF</option></select>";
}
else
document.getElementById('compdif').innerHTML="";
players=sel.value;
xmove=true;
clearttt();
owins=0;
xwins=0;
draws=0;
document.getElementById('wins').innerHTML="X has won 0 times
O has won 0 times
0 Draws.";
}
function changedif(sel)
{
xmove=true;
dif=sel.value;
clearttt();
owins=0;
xwins=0;
document.getElementById('wins').innerHTML="X has won 0 times
O has won 0 times
0 Draws.";
}
function selmove(spot)
{
if (!end)
{
if (spot.innerHTML!=Xid && spot.innerHTML !=Oid)
{
spot.innerHTML=xmove ? Xid : Oid ;
if (players=="2")
{xmove=xmove ? false : true ;
wincheck();
}
if (players=="1")
{
if (dif=="easy")
{aieasy();}
if (dif=="medium")
{aimed();}
if (dif=="hard")
{aihard();}
if (dif=="omgwtf")
{aiomgwtf();}
}
}
}
}
function randint(mi,ma)
{return Math.round(mi + Math.random()*(ma-mi));}
function aieasy()
{
moved=false;
count=0;
var ri=0;
while (!moved)
{
count++;
ri=randint(1,9);
if (document.getElementById(ri).innerHTML==" ")
{
place(document.getElementById(ri));
moved=true;
}
if (count==9)
moved=true;
}
wincheck()
}
function aimed()
{
moved=false;
var board= new Array(" ",document.getElementById("1").innerHTML,document.getElementById("2").innerHTML,document.getElementById("3").innerHTML,document.getElementById("4").innerHTML,document.getElementById("5").innerHTML,document.getElementById("6").innerHTML,document.getElementById("7").innerHTML,document.getElementById("8").innerHTML,document.getElementById("9").innerHTML)
if ((!moved)&& ((board[7]==board[5])&&board[7]!=" ") && board[3]==" ")
{
place(document.getElementById("3"));
moved=true;
}
if ((!moved)&& ((board[7]==board[3])&&board[7]!=" ") && board[5]==" ")
{
place(document.getElementById("5"));
moved=true;
}
if ((!moved)&& ((board[3]==board[5])&&board[3]!=" ") && board[7]==" ")
{
place(document.getElementById("7"));
moved=true;
}
if ((!moved)&& ((board[9]==board[5])&&board[9]!=" ") && board[1]==" ")
{
place(document.getElementById("1"));
moved=true;
}
if ((!moved)&& ((board[1]==board[5])&&board[1]!=" ") && board[9]==" ")
{
place(document.getElementById("9"));
moved=true;
}
if ((!moved)&& ((board[9]==board[1])&&board[1]!=" ") && board[5]==" ")
{
place(document.getElementById("5"));
moved=true;
}
for(i=7;i>=1;i-=3)
{
if ((!moved)&& ((board[i]==board[i+1])&&board[i]!=" ") && board[i+2]==" ")
{
place(document.getElementById(i+2));
moved=true;
}
if ((!moved)&& ((board[i]==board[i+2])&&board[i]!=" ") && board[i+1]==" ")
{
place(document.getElementById(i+1));
moved=true;
}
if ((!moved)&& ((board[i+1]==board[i+2])&&board[i+1]!=" ") && board[i]==" ")
{
place(document.getElementById(i));
moved=true;
}
}
for(i=1;i<=3;i++)
{
if ((!moved)&& ((board[i]==board[i+3])&&board[i]!=" ") && board[i+6]==" ")
{
place(document.getElementById(i+6));
moved=true;
}
if ((!moved)&& ((board[i]==board[i+6])&&board[i]!=" ") && board[i+3]==" ")
{
place(document.getElementById(i+3));
moved=true;
}
if ((!moved)&& ((board[i+3]==board[i+6])&&board[i+3]!=" ") && board[i]==" ")
{
place(document.getElementById(i));
moved=true;
}
}
if (!moved)
{aieasy();}
wincheck();
}
function aihard()
{
var moved=false;
var board= new Array("",document.getElementById("1").innerHTML,document.getElementById("2").innerHTML,document.getElementById("3").innerHTML,document.getElementById("4").innerHTML,document.getElementById("5").innerHTML,document.getElementById("6").innerHTML,document.getElementById("7").innerHTML,document.getElementById("8").innerHTML,document.getElementById("9").innerHTML)
var flagged=new Array;
var fspots=new Array(0,0);
flagged=flagspots();
var flags=0;
for (i=1;i<10;i++)
{flags= (flagged[i])? flags+1 : flags;
fspots[((fspots[0]!=0) ? 1:0)]= (flagged[i])? i:0;
}
if (flags==2)
{
if(flagged[5])
{
place(document.getElementById("5"));
moved=true;
}
for(i=9;i>0;i-=2)
if ((flagged[i])&&(!moved))
{
place(document.getElementById(i));
moved=true;
}
for(i=8;i>0;i-=2)
if ((flagged[i])&&(!moved))
{
place(document.getElementById(i));
moved=true;
}
}
if ((!moved)|| flags<2)
aimed();
wincheck()
}
function flagspots()
{
var board= new Array(" ",document.getElementById("1").innerHTML,document.getElementById("2").innerHTML,document.getElementById("3").innerHTML,document.getElementById("4").innerHTML,document.getElementById("5").innerHTML,document.getElementById("6").innerHTML,document.getElementById("7").innerHTML,document.getElementById("8").innerHTML,document.getElementById("9").innerHTML)
var flagged= new Array(false,false,false,false,false,false,false,false,false,false);
// 2 adjacent edge
if ((board[8]==board[4]) && board[8]!=" ")
{if (board[7]==" ")
flagged[7]=true;
if (
(board[5]==" ")&&
(
(
(board[2]!=" ")
&&(board[2]==board[8])
)
||
(
((board[6]!=" ")
&&(board[6]==board[8]))
)
)
)
flagged[5]=true;
}
if ((board[8]==board[6]) && board[8]!=" ")
{if (board[9]==" ")
flagged[9]=true;
if (
(board[5]==" ")&&
(
(
(board[2]!=" ")
&&(board[2]==board[8])
)
||
(
((board[6]!=" ")
&&(board[6]==board[4]))
)
)
)
flagged[5]=true;
}
if ((board[6]==board[2]) && board[2]!=" ")
{if (board[3]==" ")
flagged[3]=true;
if (
(board[5]==" ")&&
(
(
(board[2]!=" ")
&&(board[2]==board[8])
)
||
(
((board[6]!=" ")
&&(board[6]==board[4]))
)
)
)
flagged[5]=true;
}
if ((board[2]==board[4]) && board[2]!=" ")
{if (board[1]==" ")
flagged[1]=true;
if (
(board[5]==" ")&&
(
(
(board[2]!=" ")
&&(board[2]==board[8])
)
||
(
((board[6]!=" ")
&&(board[6]==board[4]))
)
)
)
flagged[5]=true;
}
// / diag test
if (((board[9]==board[5])&&board[9]!=" ")&&board[1]==" ")
flagged[1]=true;
if (((board[9]==board[1])&&board[9]!=" ")&&board[5]==" ")
flagged[5]=true;
if (((board[1]==board[5])&&board[1]!=" ")&&board[9]==" ")
flagged[9]=true;
// \ diag test
if (((board[7]==board[5])&&board[7]!=" ")&&board[3]==" ")
flagged[3]=true;
if (((board[7]==board[3])&&board[7]!=" ")&&board[5]==" ")
flagged[5]=true;
if (((board[5]==board[3])&&board[5]!=" ")&&board[7]==" ")
flagged[7]=true;
// hori test
for (i=7;i>0;i-=3)
{
if (((board[i]==board[i+1])&&board[i]!=" ")&&board[i+2]==" ")
flagged[i+2]=true;
if (((board[i+1]==board[i+2])&&board[i+2]!=" ")&&board[i]==" ")
flagged[i]=true;
if (((board[i]==board[i+2])&&board[i+2]!=" ")&&board[i+1]==" ")
flagged[i+1]=true;
}
// vert test
for (i=1;i<4;i++)
{
if (((board[i]==board[i+3])&&board[i]!=" ")&&board[i+6]==" ")
flagged[i+6]=true;
if (((board[i+3]==board[i+6])&&board[i+6]!=" ")&&board[i]==" ")
flagged[i]=true;
if (((board[i]==board[i+6])&&board[i+6]!=" ")&&board[i+3]==" ")
flagged[i+3]=true;
}
return flagged;
}
function aiomgwtf()
{
ow=owins;
xw=xwins;
aihard();
if ((xw==xwins)&&(ow==owins))
aihard();
}
function wincheck()
{
var board= new Array(" ",document.getElementById("1").innerHTML,document.getElementById("2").innerHTML,document.getElementById("3").innerHTML,document.getElementById("4").innerHTML,document.getElementById("5").innerHTML,document.getElementById("6").innerHTML,document.getElementById("7").innerHTML,document.getElementById("8").innerHTML,document.getElementById("9").innerHTML)
var win="none";
if ((board[1]!=" ")&&(board[2]!=" ")&&(board[3]!=" ")&&(board[4]!=" ")&&(board[5]!=" ")&&(board[6]!=" ")&&(board[7]!=" ")&&(board[8]!=" ")&&(board[9]!=" "))
win="draw";
if (((board[9]==board[5])&&board[9]==Oid)&&board[1]==board[9])
win="O";
if (((board[7]==board[5])&&board[3]==Oid)&&board[3]==board[7])
win="O";
for (i=7;i>0;i-=3)
{
if (((board[i]==board[i+1])&&board[i]==Oid)&&board[i+2]==board[i])
win="O";
}
for (i=1;i<4;i++)
{
if (((board[i]==board[i+3])&&board[i]==Oid)&&board[i+6]==board[i])
win="O";
}
if (((board[9]==board[5])&&board[9]==Xid)&&board[1]==board[9])
win="X";
if (((board[7]==board[5])&&board[3]==Xid)&&board[3]==board[7])
win="X";
for (i=7;i>0;i-=3)
{
if (((board[i]==board[i+1])&&board[i]==Xid)&&board[i+2]==board[i])
win="X";
}
for (i=1;i<4;i++)
{
if (((board[i]==board[i+3])&&board[i]==Xid)&&board[i+6]==board[i])
win="X";
}
if (win!="none")
{
if (win!="draw")
alert(win+' wins.');
else alert("Draw.");
if (win=="O") owins++;
if (win=="X") xwins++;
if (win=="draw") draws++;
var s="s";
if (draws==1)
s="";
document.getElementById('wins').innerHTML="X has won "+xwins+" times.
O has won "+owins+" times.
"+draws+" draw"+s+".";
var type=(win=="X") ? "win": (win=="draw") ? "draw": "lose";
if (type!="lose" && dif=="omgwtf")
{
sendtodb(type);
}
clearttt();
}
}
function place(spot)
{spot.innerHTML=Oid;}
function clearttt()
{
for (i=1;i<10;i++)
{
document.getElementById(i).innerHTML=" ";
}
xmove=true;
}
</script>
<div class="tttdiv"><div id="ttterr" > <?php
$agent=strtolower($_SERVER['HTTP_USER_AGENT']);
if (strlen(stristr($agent, 'opera'))>0)
print "Sorry, but for some reason 1 player mode won't ******* work in Opera.";?></div>
<noscript >Javascript must be enabled to play Javascript Tictactoe.</noscript>
<table id="ttt" >
<tr>
<td class="b r" id="7" onclick="selmove(this);" align="center" > </td>
<td align="center" id="8" class="b r" onclick="selmove(this);" > </td>
<td align="center" id="9" class="b" onclick="selmove(this);" > </td></tr>
<tr>
<td align="center" class="b r" id="4" onclick="selmove(this);" > </td>
<td align="center" class="b r" id="5" onclick="selmove(this);" > </td>
<td align="center" class="b" id="6" onclick="selmove(this);" > </td></tr>
<tr>
<td align="center" class="r" id="1" onclick="selmove(this);" > </td>
<td align="center" id="2" onclick="selmove(this);" class="r" > </td>
<td align="center" id="3" onclick="selmove(this);" > </td></tr>
</table>
<div name="wins" id="wins">X has won 0 times
O has won 0 times
0 Draws.</div>
<select style="height:24px;" name="changeplaysel" id="changeplaysel" onchange="changenumplayers(this)" >
<option value="1" style="height:14px;">1 Player</option>
<option value="2" <?php
if (strlen(stristr($agent, 'opera'))>0) print "selected=\"selected\"";?> style="height:14px;">2 Players</option>
</select><div name="compdif" id="compdif" ></div>
<script type="text/javascript" language="javascript">
if (document.getElementById('changeplaysel').value=="1")
{document.getElementById('compdif').innerHTML="<select name='changedif' style=\"height:24px;\" onchange='changedif(this)'><option value='easy' style=\"height:14px;\">Easy</option><option value='medium' style=\"height:14px;\">Medium</option><option style=\"height:14px;\" value='hard'>Hard</option><option style=\"height:14px;\" value='omgwtf'>OmgWTF</option></select>";}
else
document.getElementById('compdif').innerHTML="";
</script>
<input type="button" value="Clear board" name="clear" onclick="clearttt()" class="inputbutton" />
</div>
I have the same issue with my app twittFilter.com
Its random.. There are times the innerHTML will work, times it will just update the page.
Its random.. There are times the innerHTML will work, times it will just update the page.
3. May 2010, 17:50:55 (edited)
ok i have found what part of the problem is, a td with an innerHTML of is considered to have null innerHTML instead of
wtf
wtf
Seriously? Where:
http://lmgtfy.com/?q=opera+bug+report
http://lmgtfy.com/?q=opera+bug+report
Opera 12; Windows 7 x64 SP1; Intel Xeon W3550; 12GB DDR 1333; 3.5M/128k DSL ; Comodo IS 5.10;Proxomitron 4.5j Sidki 2010-10, Custom Filters;
Journal
Journal
6. May 2010, 19:13:11 (edited)
Originally posted by therealisildur4:
ok i have found what part of the problem is, a td with an innerHTML of is considered to have null innerHTML instead of
wtf
Are you sure it's null and not "\xA0"?
Try this though (and view source of it). Firefox passes that (even with the HTML5 parser enabled in about:config), but Opera does not.