5

この答えがここにあることは知っていますが、見つけることができませんでした（または、少なくとも見たときに認識できました！）。私はjqueryに比較的慣れていないので、ご容赦ください。

問題：

1.png から20.pngという名前の 20 個の画像があります。ユーザーがボタンをクリックするたびに、別の画像をランダムに表示したいと考えています。

何が機能していますか:

乱数を生成するための私の JavaScript コードは次のようになります。

var randomImage = 1 + Math.floor(Math.random() * 20);

そうではないもの...

私がやろうとしているのは、その結果を画像の名前として HTML ドキュメントに渡すことです。つまり、次のようになります。

 <img id="randImg" class="img_answer" src="randomImage.png">

連結しようとしましたが、これを理解できないようです。img ID またはクラスに影響を与える関数を作成する必要がありますか? 誰でもこれを行うための最もクリーンな方法を教えてもらえますか?

4

5 に答える 5

4

教えるのに役立つように少し綴ります：

あなたのページには、次のようなものがあります。

<img id=randomImage />

そしておそらく、ロードする画像を選択するまで画像を非表示にする頭の中で、これは次のとおりです。

<style>
#randomImage {
    width: 400px; height: 200px; /* or whatever the dimensions are */
    visibility: hidden;
}
</style>

次に、Javascriptで：

var ordinal = 1 + Math.floor(Math.random() * 20);
$('#randomImage').css('visibility', 'visible').attr('src', ordinal + '.png');

そのため、HTML は img タグを配置し、一部の初期の CSS はその寸法を設定して非表示にするため、一部のブラウザーでは醜い壊れた画像アイコンなどは表示されず、空白だけになります。

その後、最終的に Javascript が読み込まれて実行され、ランダムな序数が決定されます。Javascript の 2 行目は、jquery を呼び出して img を表示し、その src 属性をランダムな画像に設定します。

于 2013-03-31T19:09:37.377 に答える