
いつもお世話になっているばかりのLaoYuです。
テーブルの各セルにデータが入ってある、セルごとをクリックするとそのデータを取り出したい(サブウインドような感じで)
var wForm = document.getElementById('ReserveReportForm').innerHTML=”???”ここにどう書けばいいのかな~?
ソース----
<form name="ReserveReportForm" id="ReserveReportForm" action="#">
<table width="<%=wtblw%>" cellpadding="0" cellspacing="0" style="height:265px;">
<tr align="center" class="time_font" >
<td height="23" colspan="2" class="normal_cell" background="t.jpg"><%=wHHmm%></td>
</tr>
<tr>
<td " + wtdid + " width="25" height="23" valign="top" " + wclass + ">
<a tabindex=-1 href="#" onClick="NlOnClick(this," + wi + "," + wj + "," + wsid + "," + wrsvid + "," + wHHmmss + ")" onDblClick="NlOnDoubleClick(this," + wi + "," + wj + "," + wsid + "," + wrsvid + "," + wHHmmss + ")">
<img src="Cell.gif" width="20" height="20" border="0"/>
</a>
</td>
</tr>
</table>
</table>
-------ソース
本文のソースが長すぎるため、全文の引用ができなくてすみませんです、これだけでも何とか解決方法いただけるのかな~?
No.2ベストアンサー
- 回答日時:
こんにちは。
#1です。>子ウインドの方はalertじゃないの方にしたいですが
alertは、取得できている内容の確認のための手段です。実際の処理の記述は処理内容をご存知の質問者さんがなさってください。
(質問文からは処理内容が読み取れませんので・・)
>またtdタグにIDの属性をつけてあるのでその値を取得にGetElementByIdでの方法は間違いはないでしょう?
はい、その通り確実ですね。
でも、、それだと質問の意図そのものがますます不明になってしまいます。(何を質問したかったのでしょう?)
各タグ毎にイベントを設定してよいのなら、いちいちidをふる必要もないのでは?
<html>
<head>
<style type="text/css">
tr{height:80px;}
td{text-align:center;}
</style>
<script type="text/javascript">
window.onload=function(){
var e=document.getElementById('tbl').getElementsByTagName('td');
for (var i=0; i<e.length; i++){e[i].onclick=function(){hoge(this)};}
}
function hoge(e){e.style.backgroundColor='yellow';}
</script>
</head>
<body>
<table id="tbl" border=1 width="400px">
<tr>
<td>1-1</td><td>1-2</td><td colspan=2>1-3<ul><li>No 1<li>No 2</ul></td>
</tr>
<tr>
<td>2-1</td><td rowspan=2>2-2<p><a>
<img src="fuga.jpg" alt="図"></a><br>文字</td><td colspan=2>2-3</td>
</tr>
<tr>
<td>3-1</td><td>3-3</td><td>3-4</td>
</tr>
</table>
</body>
</html>
No.1
- 回答日時:
質問文のサンプルでは、何をどうしたいのか読み取れませんでした。
(<form>が閉じてないので意味が不明、onClickやonDobleClickの処理が不明、formに対してwFormは何の処理をしたいのか不明 など)
とりあえず
>tdのidの値を取得、サブウインドに取得したデータを表示
ということらしいので、セル内をクリックした時に、tdを特定してその内容を得るサンプルを・・・
あとは適当にアレンジしてください。
tableの外周枠をクリックすると、テーブル全体を拾う場合があるので、その場合を除いてください。(タグで識別可能)
<html>
<head>
<style type="text/css">
tr{height:80px;}
td{text-align:center;}
</style>
<script type="text/javascript">
function hoge(e){
var obj=e?e.target:event.srcElement;
while (obj.tagName!='TD' && obj.tagName!='TABLE') {
obj=obj.parentNode;
}
alert("[ id="+obj.id+" ]\n"+obj.innerHTML);
}
</script>
</head>
<body>
<table id="tbl" border=1 width="400px" onclick="hoge()">
<tr>
<td id="1-1">#1-1</td><td id="1-2">#1-2</td>
<td id="1-3" colspan=2>#1-3<ul><li>No 1<li>No 2</ul></td>
</tr>
<tr>
<td id="2-1">#2-1</td><td id="2-2" rowspan=2>#2-2<p><a>
<img src="fuga.jpg" alt="図なし"></a><br>文字</td><td id="2-3" colspan=2>#2-3</td>
</tr>
<tr>
<td id="3-1">#3-1</td><td id="3-3">#3-3</td><td id="3-4">#3-4</td>
</tr>
</table>
</body>
</html>
返事遅くて申し訳ないです。
自分もちょっと説明足りないのが分かりながら、曖昧な質問をしてしまって、すみませんね。
とりあえず、fujillinさんのヒントでやってみます、またよろしくお願いします。
子ウインドの方はalertじゃないの方にしたいですが
たとえばwin.???、またtdタグにIDの属性をつけてあるのでその値を取得にはGetElementByIdでの方法は間違いはないでしょう?
そして自分もまた試してみます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS テーブルタグのセルの幅の一部だけを指定 1 2023/03/12 12:02
- Visual Basic(VBA) Selenium.ChromeDriverの使い方について 7 2022/09/22 06:43
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
- JavaScript EasyUIのSubGrid(jquery)におけるObjectに入れた連想配列について 1 2022/05/02 11:21
- AJAX JavascriptからPHPへのAjax通信でnullが返ってくる 3 2022/08/03 22:00
- HTML・CSS 自身のHPにYouTube動画を貼り付けるのが出来なくなり困ってます 1 2022/11/11 10:44
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- HTML・CSS 【CSS】:hasで可能? imgを含むtr要素を選択したい 1 2022/11/17 14:36
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ツールチップにテーブル左端列...
-
Javascriptのことは、ほとんど...
-
テキストだけonCllickを検知したい
-
ラジオボタンとセルの連動
-
テーブルの変数について
-
onclickで画像と文字を別々の場...
-
階層式メニューをtableタグ内に
-
IEではうまく行くのですが他の...
-
テーブル内に表示されている数...
-
jspでのArrayListの値の表示
-
data-hrefでのcolorbox設定方法
-
firefoxでchildNodesの代用
-
jQueryのプラグイン「Tablesort...
-
JavaScriptでHTML内に記入され...
-
ハイパーリンクを別ウインドウ...
-
月間予定表の作り方
-
ラジオボタンで指定したテーブ...
-
データベース呼び出しに使用す...
-
tableの任意行にfocusをあてる
-
Selenium.ChromeDriverの使い方...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ハイパーリンクを別ウインドウ...
-
特定<table>内の<td>の色を変える
-
一覧から選択した行の行番号を...
-
tableの任意行にfocusをあてる
-
JavaScriptで特定のtdタグにcla...
-
プルダウンで選択すると、DBの...
-
Selenium.ChromeDriverの使い方...
-
チェックボックスにチェックが...
-
HTML中のTABLEのデータを抽出す...
-
マウスをブラウザの外に出した...
-
tdの中をクリックしたらチェッ...
-
至急!GetElementById でtdの...
-
IE以外でdisplay:noneで隠した...
-
テーブル内に表示されている数...
-
動的なtableの値を取得したい
-
テーブルの項目の値取得
-
クリックされた罫表セルの行番...
-
テーブル内に表示されている数...
-
Excelで作ったhtmlファイルのサ...
-
jqueryで表に連番No.を追加したい
おすすめ情報