Thanks for pointing out. Getting use to rely on compiler to check for
mistakes and very clumpsy with script. OK, I'd checked and double
checked the modifed display functions as you'd suggested. But, it
is still not working with IE.
I have two types of board(8x8) or (14x14) depending on the number of
players. I delete all rows and create a new ones if the new board differs
from the previous one.
function deleteRow(i)
{
document.getElementById('my_table').deleteRow(i)
}
function maketable()
{
var r,x,y,z,v,c;
for (y=0;y<=YMAX;y++)
{
r=document.getElementById('my_table').insertRow(y) ;
for (x=0;x<=XMAX;x++)
{
z=r.insertCell(x);
if ((y<YMAX) && (x==0))
z.innerHTML=YMAX-y;
if ((y==YMAX) && (x>0))
{
if (x==1)
z.innerHTML='A';else
if (x==2)
z.innerHTML='B';else
if (x==3)
z.innerHTML='C';else
if (x==4)
z.innerHTML='D';else
if (x==5)
z.innerHTML='E';else
if (x==6)
z.innerHTML='F';else
if (x==7)
z.innerHTML='G';else
if (x==8)
z.innerHTML='H';else
if (x==9)
z.innerHTML='I';else
if (x==10)
z.innerHTML='J';else
if (x==11)
z.innerHTML='K';else
if (x==12)
z.innerHTML='L';else
if (x==13)
z.innerHTML='M';else
if (x==14)
z.innerHTML='N';
}
}
}
}
function display_board()
{
var i=8,c2Len;
var j=0;
var k=0;
var v=0;
var r,x,y;
for (y=0;y<=YMAX;y++)
{
for (x=1;x<=XMAX;x++)
{
r=document.getElementById('my_table').rows[y].cells;
v=my_board[x-1][YMAX-y-1];
if (v>=0)
{
for (var i=0, c2Len=r[x].childNodes.length; i<c2Len; i++)
if (r[x].childNodes[i].nodeName.toLowerCase() == 'img')
{
r[x].childNodes[i].src = pieces[v];
return; // Stop once image replaced
}
var spanNode = document.createElement('img');
spanNode.src=pieces[v];
spanNode.width=wl;
spanNode.height=wl;
r[x].appendChild(spanNode);
}
}
}
}
function change_cell(y,x,my_piece)
{
var xx=0,c2Len;
var r=document.getElementById('my_table').rows[y].cells;
for (var i=0, c2Len=r[x].childNodes.length; i<c2Len; i++)
if (r[x].childNodes[i].nodeName.toLowerCase() == 'img')
{
r[x].childNodes[i].src = my_piece;
return;
}
var spanNode = document.createElement('img');
spanNode.src=my_piece;
spanNode.width=wl;
spanNode.height=wl;
r[x].appendChild(spanNode);
}
RobG <rg***@iinet.net.auau> writes:
Better but still clumpsy wrote: This function works as intended with Netscape/Modzilla.
But, it doesn't work with IE version 6.0.2900.2180.xpsp_sp2_rtm040803-2158.
Can someone tell me how to fix it?
I'm surprised it 'works' at all. I can only guess at the HTML
associated with this, you should have provided a minimal snippet
to help out. Anyhow, here's my guess.
Thanks.
function change_cell(y,x,my_piece)
{
var xx=0;
xx=x+1;
You appear to be passing a number as 'x', so why not just use
that, and use x wherever you've used xx?
x++;
if (document.getElementById) {
var rowRef = document.getElementById(r);
You have not defined 'r', so this will fail (you declare it
below, so I guess it's not a global you didn't tell us about)
} else if (document.all) {
var rowRef = document.all[r];
}
var theCells=document.getElementById('my_table').rows[y].cells;
'theCells' is a collection of the cells for a row index you
passed to the function - it seems 'my_table' is what r should
have been initialised with before attempting to use it above.
if (!theCells[0]) theCells = rowRef.childNodes;
I guess you are seeing here if the cells collection is supported,
and if not, using the childNodes collection.
var r=document.getElementById('my_table').rows[y].cells;
Now you declare 'r' using gEBI, which you should have done
above...
while (r[xx].childNodes.length > 0)
r[xx].removeChild(r[xx].childNodes[0]);
and proceed to ignore all the work you did getting 'theCells'.
[...]
As far as I can see, you are attempting to replace the image in
an adjacent table cell. If that's what you want to do, try
this (lightly tested in Firefox and IE6):
<script type="text/javascript">
function changeCell(c){
// c is a reference to the cell clicked on
// Get the adjacent cell
var c2 = c.parentNode.cells[c.cellIndex + 1];
// Change the image source
// You could just replace the innerHTML of the cell...
// Or delete all the childNodes and put an img in there...
// But I'll search for an img and replace the src
for (var i=0, c2Len=c2.childNodes.length; i<c2Len; i++){
if (c2.childNodes[i].nodeName.toLowerCase() == 'img'){
c2.childNodes[i].src = '2.gif';
return; // Stop once image replaced
}
}
}
</script>
<table>
<tr>
<td onclick="
changeCell(this);
">aaaaaaaa</td>
<td><img src="1.gif" alt=""></td>
</tr>
<tr>
<td onclick="
changeCell(this);
">bbbbbbbb</td>
<td><img src="1.gif" alt=""></td>
</tr>
</table>
--
Rob
