BBSのアイコンをプルダウンメニューで画像も表示したい・・・

質問

初めて投稿します。
今、新しくBBSを作っています。

ココです→http://otdi5.jbbs.livedoor.jp/2015140/bbs_tree

アイコンをプルダウンメニューで選択してその上に選ばれた画像を表示させたいのですがうまくいきません。
テーブルが邪魔をしているのでしょうか？
単独だと思っていることができるのですが、名前フォームやコメント書く欄を作ってその中に入れると画像が切り替わりません。
また、投稿もできなくなってしまいました。
初心者でいろんな検索かけながら作り上げたのですが、あと一歩のところで苦戦しています。

わかる方がいらっしゃいましたら力を貸してくださいm(__)m

回答No.3

leap_day · ベストアンサー

こんにちは（＾＾）

ん？見比べてみても分かりませんでした？

仕方ありませんね～～見比べて発見していただけると一番良かったのですが・・・（＞＜）

<SELECT name="etc5" onchange="look();">の上

『<FORM method="post" name="change">』の部分がおかしいと思います

おそらくselect boxにname属性を持たせようとしてつけたのだと思いますがこの22行上
<form action="bbs_write" method="post" name="change">
この部分でフォーム全体にname属性をつけてるので新たに命名する必要は無いのです

『document.change.change.etc5.selectedIndex』って感じになってしまいます
まぁフォームの中にまたフォームを作ってるのでそれもおかしくなってる原因かも（＞＜）

ですので

<FORM method="post" name="change">
とその20行下
</FORM>

を削除すれば動くと思います

お礼

あー、私いらないところにフォームつけてたんですね;;
なんかまだまだわからないほんとの初心者なもので見比べるのいっぱいいっぱいでどこが違うのかがいまいちわかりませんでした。。
すいません＞＜！
でも、親切に教えてくださったおかげで自分のやりたいものができました！
ありがとうございます。
自力でやろうと思って頑張ってたのですが、ここを発見して質問してよかったです。

回答No.2

leap_day

こんにちは（＾＾）

こちらが正規だったんですね(笑）

失礼ながらご提示のページのソース拝見させてもらいましたｍ（－－）ｍ
僕もどちらかといえばアマチュアの方なので所々分からない部分もありましたが
とりあえず見た目が同じで(文字の部分が<th>なのでちょっと強調されてますが・・・）機能もほぼ同じに(set_cookieの方はまだ手をつけてないので分からないのですが）して次ページに送信することができましたのでテーブル部だけ書きますね（＾＾）

<SCRIPT language="JavaScript">
<!--
function look()
{
iti=document.change.etc5.selectedIndex;
image=document.change.etc5.options[iti].value;
document.war.src=image;
}
//-->
</SCRIPT>
<STYLE type="text/css">
<!--
form tbody { background:FFFF75;
color:black;
text-align: left; }
form tbody td { background:FFC8C8; }
form tbody img { width:100px;
height:100px;
border:0px;
}
-->
</style>
<form action="****.cgi" method="post" name="change">
<table border="0">
<tr><tbody>
<th >※Name(名前)</th>
<td nowrap><input type="text" name="handle" size="20"></td>
</tr><tr>
<th>※Subject(タイトル)</th>
<td><input type="text" name="subject" size="15"></td>
<th>アイコン(icon)</th>
</tr><tr>
<th>※Mesage(コメント)</th>
<td><textarea name="message" cols="35" rows="7"></textarea></td>
<td>

<img src="****.jpg"​ name="war"><br>
<select name="etc5" onchange="look();">
<option selected value="">アイコン
<option value="****.jpg">John-Hoon01
<option value="****.jpg">John-Hoon02
<option value="****.jpg">John-Hoon03
<option value="****.jpg">John-Hoon04
</select>
</td>
</tr><tr>
<th>Mail(メール)</th>
<td><input type="text" name="email" size="35"></td>
</tr><tr>
<th>URL</th>
<td><input type="text" name="url" size="35"></td>
</tr><tr>
<th>※削除キー</th>
<td>
<input type="text" name="key" size="6">
cookie:<input type="checkbox" name="ck_box" style="border-style:solid;border-color:#cccccc" checked>
<input type="submit" value="Submit[投稿]" onclick="set_cookies();">
</td>
</tr>
</tbody></table></form>

<form action="****.cgi" method="post" name="change">と
****.jpgは変更してくださいね（＾＾）

あと１個１個書くのが面倒だったのでスタイルシート使ってます（＞＜）
元の書き方でも構わないと思うので見比べて参考にするなどしてください

お礼

わざわざこちらにまで来てくださってすいません。。
ありがとうございます＞＜！
えーっと、画像の表示は出来るようになりました。
もう一方の欄にもお返事で少し書いていますが、投稿ボタンが反応しなくなりました;
アイコンの欄だけ変な位置に作ってるからでしょうか？
投稿ボタンを押して前のように全部がきちんと反映されるようにしたいのですが、今回は全く原因がわかりません。。
もしわかるようでしたらもう一度お力を貸してくださいm(__)m

回答No.1

yambejp

look()のなかで
iti=document.change.etc5.selectedIndex;
としていますが、肝心のformにchangeと言う名前がついていません。
セレクトボックスの入っているformに
<form action="bbs_write" method="post" name="change">
としてあげてください。

お礼

ありがとうございます！
肝心なところを見落としてたんですね。
助かりました^^
ただ・・投稿ボタンが反応しなくなってしまったのですが原因とかわかりますでしょうか？
度々すみませんがもしわかったら教えていただけたら嬉しいです。