1

コンピューターのフォルダーに 5 つの画像があり、画面に画像を表示するスクリプトを作成しようとしています。ボタンをクリックすると画像が変わります。

JavaScript コード:

function cambiaimagen()
{
var i=1;
var direcciones = new            
    Array("imagen1.jpg","imagen2.jpg","imagen3.jpg","imagen4.jpg","imagen5.jpg");
var vusr = document.getElementById('imgs').value;
document.getElementById('imgs').innerHTML = vusr;
}

HTML コード:

<div id="contenedor">

<div id="img">
<img id="imgs" src="imagen1.jpg"/>
</div>

<button type="button">Anterior</button>
<button type="button" onclick = 'cambiaimagen()'>Siguiente</button>

</div>

スクリプトを実行すると、画像 1 とボタンが表示されます。しかし、Siguiente ボタンをクリックすると、次の配列方向の画像が表示されません。

どうすれば視聴できますか？

ありがとう。

4

2 に答える 2

1

以前の JavaScript コードを次のように置き換えます。

var cnt = 1;
var direcciones = new Array("imagen1.jpg","imagen2.jpg","imagen3.jpg","imagen4.jpg","imagen5.jpg");
function cambiaimagen(){
    if(cnt != direcciones.length - 1){
        cnt++;
    }else{
        cnt = 1;
    }
    document.getElementById('imgs').src = direcciones[cnt];
}

画像名が（例のように）連続番号順である場合、代わりに次を使用できます。

var cnt = 1;
var imgCnt = 5;
function cambiaimagen(){
    if(cnt != imgCnt){
        cnt++;
    }else{
        cnt = 1;
    }
    document.getElementById('imgs').src = "imagen" + cnt + "2.jpg";
}

繰り返しの内容を持つ配列がないため、これはより良い方法だと思います。

于 2013-07-31T18:08:58.430 に答える
1 
var direcciones = ["imagen1.jpg","imagen2.jpg","imagen3.jpg","imagen4.jpg","imagen5.jpg"];
var cnt = 0;
function cambiaimagen(){
document.getElementById("imgs").src = direcciones[(++cnt)%direcciones.length];
}
于 2013-07-31T18:09:59.063 に答える