0

これを行うための最良の方法を見つけようとしています.これは私が作成しようとしているフォームの1つであり、3つの異なるフォームではありません.

http://www.amazinsounds.com/form-image-if.png

申し訳ありませんが、まだ担当者 10 を持っていないため、イメージ表現を投稿できませんでした。

ユーザーが色を選択すると、画像が変化します。円の位置を選択すると、画像が変わります。それぞれが何か違うものです。ここで検索を行いましたが、まだ方向性の点で確かなものは何も思いつきません. 少し理解するのに役立った、私が見た唯一のものはこれです：

<HTML><HEAD><SCRIPT>
// preload images
var img1 = new Image().src = "../images/jht.gif"
var img2 = new Image().src = "../images/jsht.gif"
var img3 = new Image().src = "../images/pht.gif"

function setImage(imageSelect) {
 theImageIndex = imageSelect.options[imageSelect.selectedIndex].value;
 if (document.images)
     document.images[0].src = eval("img" + theImageIndex);
  }
</SCRIPT></HEAD><BODY>
<FORM NAME="theForm" METHOD="POST">
<TABLE><TR><TD>Images: <TD>
<SELECT NAME="items" onChange="setImage(this)">
   <OPTION VALUE="1">Java How-to
   <OPTION VALUE="2">Javascript How-to
   <OPTION VALUE="3">Powerbuilder How-to
 </SELECT>
 <TD><IMG SRC = "../images/jht.gif" HEIGHT=100 WIDTH=200>
 </TABLE></FORM></BODY></HTML>

しかし、それは私がやろうとしていることではありません。PHP は知っていますが、JavaScript はまだ理解していません。

4

2 に答える 2

0

私はそれを試してみて、正しく実行すると正しいコードは次のとおりです。

<head>
<script type="text/javascript">
// preload images
    var img1 = new Image().src = "images/jht.gif";
    var img2 = new Image().src = "images/jsht.gif";
    var img3 = new Image().src = "images/pht.gif";

    function setImage(imageSelect) {
        theImageIndex = imageSelect.options[imageSelect.selectedIndex].value;
        if (document.images)
            document.images[0].src = eval("img" + theImageIndex);
    }
</script>
</head>
<body>
<form name="theForm" method="post">


<table>
<tr>
    <td>Images: </td>
    <td>

<select name="items" onchange="setImage(this)">
<option  value="1">Java How-to </option>
<option value="2">Javascript How-to </option>
<option value="3">Powerbuilder How-to</option>
</select>
</td>
<td><img src = "images/jht.gif" height="100" width="100"/></td>
</tr>
</table></form>
</body>
于 2013-07-18T09:32:24.737 に答える
0

最初のルール:必要がない場合は eval を使用しないでください。最初に配列に保存すると、画像を取得するためのコードを変更できます。

var images = [];
images[1] = new Image(); images[0].src = "../images/jht.gif";
images[2] = new Image(); images[1].src = "../images/jsht.gif";

次に、画像を設定すると、次のようになります (画像に ID を指定したと仮定します)。

document.getElementById('imageID') = images[theImageIndex];

一般的なヒント:console.log()コードをデバッグするときに使用します。このように、コードのどこに問題があるかがわかります。エラー メッセージから、失敗した理由の大きなヒントが得られます。

于 2013-07-18T08:39:52.703 に答える