プロが教える店舗＆オフィスのセキュリティ対策術

JavaScriptでの表の行の表示・非表示の切り替え

解決済

  • 質問者：sheer
  • 質問日時：
  • 回答数：2件

現状では、テスト1を選んだときだけテキストを出すことはできるのですが、どうしても2行表示するという事ができません。
テスト1を選択した時だけ2行表示し、テスト1以外を選択した時は非表示にするにはどうすればよいのでしょうか。

<html>
<head>
<title>テスト</title>
<script type="text/javascript" language="JavaScript">

<!--
function showthis(sel) {
var value = sel.options[sel.selectedIndex].value;
if(value == "test1"){
if(document.getElementById){
if(document.getElementById(value).style.display == "block"){
document.getElementById(value).style.display = "none";
}else{
document.getElementById(value).style.display = "block";
}
}
}
else if(value != "test1"){
if(document.getElementById){
document.getElementById("test1").style.display = "none";
}
}
}
// -->
</script>
</head>
<body>

<table border="1" width="367">
<tr>
<td width="134">
<form>
<select onchange="showthis(this)">
<option selected="selected">選んでください</option>
<option value="test1">テスト１</option>
<option value="test2">テスト２</option>
<option value="test3">テスト３</option>
</select>
</form>
</td>

<td width="217">
<p>テスト</p>
</td>
</tr>

<tr>
<td width="134">
<p></p>
</td>
<td width="217">
<p></p>
</td>
</tr>
</table>

<div id="test1" style="display:none;">
（本来はここに2行追加したい）
</div>
</body>
</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (2件)

No.2ベストアンサー

  • 回答者： BLUEPIXY
  • 回答日時：

要するに、テーブルに行の追加・削除したいということだったら


参考ＵＲＬが参考になるかと思います。
表示・非表示の線では、
<tr id="test1" style="display:none">
とか
<tfoot id="test1" style="display:none">
でＩＥの場合はうまく行きましたが、FireFoxの場合うまくいきませんでしたので、行の追加・削除でやるのがいいかと思います。

参考URL：http://okwave.jp/kotaeru.php3?qid=1797452
    • good
    • 0
    • 件
通報する
この回答へのお礼

ありがとうございます。おかげで実装する事ができました。

通報する
お礼日時：2005/12/22 01:49

No.1

  • 回答者： fazan
  • 回答日時：

拝見しました。


質問の２行という意味がわかりませんが、
単純にコメントの部分に２行記述すればいいのではないですか？

２行という具体的な提示をして頂ければ回答もできるかと思います。

この回答への補足

ありがとうございます。2行というのは、初期表示されている表の下に行を2行追加表示させたいという事です。
ただ、下記のように記述しても、上手く動作しません。
<div id="test1" style="display:none;">
<tr>
<td width="134">
<p></p>
</td>
<td width="217">
<p></p>
</td>
</tr>
</div>

補足日時：2005/12/18 21:59
通報する
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

関連するカテゴリからQ&Aを探す

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報