HTMLページのtableタグ中、td,/tdで作られたセルに対し、onMouseOver,onclickなどのイベントをJavascriptで取得したいです。カラーピッカーなどで使われているようですが、どうやってイベント取得するのかわかりません。教えてください。

回答の条件
  • 1人2回まで
  • 登録:2006/05/01 14:27:22
  • 終了:2006/05/01 21:38:11

回答(2件)

id:llusall No.1

llusall回答回数505ベストアンサー獲得回数612006/05/01 15:12:09

ポイント100pt

このような感じで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>

id:masashi0316

できました。なんか、難しく考えすぎてたみたいです。。ありがとうございました!!

2006/05/01 21:30:00
id:llusall No.2

llusall回答回数505ベストアンサー獲得回数612006/05/01 15:50:41

ポイント50pt

テーブルタグにイベントを設定する方法もありましたので紹介します。


<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...

id:masashi0316

ありがとうございます、参考になりました。

2006/05/01 21:37:17

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません