- ベストアンサー
フォームに入力された値で画像を変更する方法
- HTMLページのテーブル内の画像をフォームの入力値によって別の画像に変更する方法を教えてください。
- JavaScriptを使用してフォームの入力欄に画像のファイル名を入れ、ボタンを押すことで画像が変更される仕組みを作りたいです。
- 画像のファイル名の一部をフォームの入力値として受け取り、JavaScriptで画像のファイル名を作成する方法を教えてください。
- みんなの回答 (1)
- 専門家の回答
質問者が選んだベストアンサー
別ウィンドウはサブウィンドウ(自身がopenした)でしょうか。 であるなら以下になります。 (エラー処理とか手抜きなので適宜追加してください。) ---------------- 【main.htm】 <html> <script> function changeImg(){ var img = document.getElementById("img"); var name = "img/" + document.getElementById("name").value + ".gif"; img.src = name; } </script> <body> <img src="img/sample1.gif" id="img"/> <input type="text" id="name"/> <input type="button" value="CHANGE" onclick="changeImg();"/> <input type="button" value="SUB" onclick="window.open('sub.htm');"/> </body> </html> ---------------- 【sub.htm】 <html> <script> function changeImg(){ var img = window.opener.document.getElementById("img"); var name = "img/" + document.getElementById("name").value + ".gif"; img.src = name; } </script> <body> <input type="text" id="name"/> <input type="button" value="CHANGE" onclick="changeImg();"/> </body> </html>
お礼
susie-tさん ご回答ありがとうございました。 大変助かりました。 キャサリン