このような感じでTDタグにイベントを付けてはどうでしょうか?
<html>
<body>
<table border=1>
<tr>
<td id="a" onclick="clicked(this);" onmouseover="mover(this);" onmouseout="mout(this);">AAAA</td><td id="b" onclick="clicked(this);" onmouseover="mover(this);" onmouseout="mout(this);">BBBB</td>
</tr>
</table>
<input type="text" name="txt" >
</body>
</html>
<SCRIPT LANGUAGE="JavaScript">
<!--
function clicked(o){
alert("clicked! " + o.id);
}
function mover(o){
document.all.txt.value = "mouse over";
}
function mout(o){
document.all.txt.value = "mouse out";
}
//-->
</SCRIPT>
テーブルタグにイベントを設定する方法もありましたので紹介します。
<html>
<style>
td { text-align: center; }
</style>
<script language="javascript">
function highlight(e,b) {
var src;
// Netscape イベント処理用の分岐
if (navigator.appName == "Netscape"){
src = e.target;
}else{
src = e.srcElement;
if (src.tagName == "TD") {
if(b==true) { // mouseOver, and highlight {
src.originColor=src.style.backgroundColor;
src.style.backgroundColor="yellow";
}else{ // mouseOut, restore original color
src.style.backgroundColor=src.originColor;
}
}
}
}
</script>
<body>
<table id="table1" width="20%" border="1"
onmouseover="highlight(event,true)"
onmouseout="highlight(event,false)">
<tr><th>Simple Table</th></tr>
<tr><td>Cell 1</td></tr>
<tr><td>Cell 2</td></tr>
<tr><td>Cell 3</td></tr>
<tr><td>Cell 4</td></tr>
</table>
</body>
</html>
ここにサンプルがありました。(こちらスクリプトエラーになるので改修しました)
http://www.microsoft.com/japan/msdn/asp.net/using/migrating/jspm...
ありがとうございます、参考になりました。
できました。なんか、難しく考えすぎてたみたいです。。ありがとうございました!!