どのセルをクリックされたのか

質問

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

テーブルのどのセルをクリックされたかを得る方法を教えてください。
例えば36をクリックされたら(1,1)という値が得られるfunc()です。
getElementedByIdを使わない方法を教えてください。
<td>の1つ1つにonClickを書けばやりたいことはできますが
HTMLファイルのサイズを小さくするために別の方法を考えています。

<table border=1 onClick=func()>
<tr><td>15<td>18
<tr><td>52<td>36
</table>

<script>
function func(c){

alert()
}

</script>

回答No.1

Bonjin

IEオンリーの方法を使えばこんな感じです。

<table id="mytable" onclick="func();">
<tr><td>15</td><td>18</td></tr>
<tr><td>52</td><td>36</td></tr>
</table>

<script type="text/javascript">
function func(){
var eventCell = window.event.srcElement;
var row = -1;
var col = -1;
for(var r = 0; r < mytable.rows.length && row < 0; r++){
for(var c = 0; c < mytable.rows.item(r).cells.length && col < 0; c++){
if(mytable.rows.item(r).cells.item(c) == eventCell){
row = r;
col = c;
}
}
}
alert(row + ", " + col);
}
</script>

以下は動的にテーブルデータを出力する場合です(IE以外でも動くはず)。

<table>
<script type="text/javascript">
var data = new Array();
data[0] = new Array("15", "18");
data[1] = new Array("52", "36");

for(var r = 0; r < data.length; r++){
var rowData = data[r];
document.write("<tr>");
for(var c = 0; c < rowData.length; c++){
document.write("<td onclick=\"func(" + r + "," + c + ");\">" + rowData[c] + "</td>");
}
document.write("</tr>");
}

function func(row, col){
alert(row + ", " + col);
}
</script>
</table>

お礼

ありがとうございます。
func()に引数を与えないと総当りしかないわけですか。
そうすると処理速度を考えて、ソースが大量になりますが後者の方がよさそうです。
ありがとうございました。