0

OK、これが問題です。スライドショー用の簡単なコードを書きました。動作し、期待どおりでした。それだけです。

var slideShowImage = document.getElementById("slideShowImage");
var images = ["_Images/Image_01.jpg","_Images/Image_02.jpg","_Images/Image_03.jpg","_Images/Image_04.jpg","_Images/Image_05.jpg","_Images/Image_06.jpg","_Images/Image_07.jpg"];
var imageIndex = 0;

function changeImage (){
    slideShowImage.setAttribute ("src",images[imageIndex]);
    imageIndex++;
    if (imageIndex >= images.length){
            imageIndex = 0;
        }   
    }

setInterval (changeImage,3000);

しかし、私はまだjavaScriptを学んでいるので、自分で味わうためにロジックを変更することを考え、コードを書き直しましたが、うまくいきません。理由がわかりません...うまくいかない理由を教えてください。 ...

var imageId = document.getElementById("slideShowImage");
var imageNumber = 1;
var imageName = "_Images/Image_0"+imageNumber+".jpg";

function changeImage (){
    imageId.setAttribute("Src",imageName);
    imageNumber++;
    if (imageNumber==7){
        imageNumber=1;
        }
    }
setInterval(changeImage,1000);
4

5 に答える 5

2

2 番目のアプローチでは、var imageName は静的な値、つまり "_Images/Image_0"+imageNumber+".jpg" に割り当てられます。最初の回答によると、この変数の値を再計算する必要があります。

代わりに、計算された値を返す関数として imageName を書くことができます

var imageName = function(){ return "_Images/Image_0"+imageNumber+".jpg"; }

そしてchangeImage内で呼び出します

function changeImage (){
    imageId.setAttribute("Src",imageName());
    imageNumber++;
    if (imageNumber==7){
        imageNumber=1;
        }
    }
于 2013-04-10T09:38:48.600 に答える
0

あなたが犯したエラーは、バージョンのイメージ名が反復ごとに 1 回評価されないことです。

var imageId = document.getElementById("slideShowImage");
var imageNumber = 1;
setInterval(function() {
  imageId.setAttribute("src","_Images/Image_0"+imageNumber+"jpg");
  imageNumber++;
  if (imageNumber == 7) imageNumber = 1;
},1000);

これにより、コードが実際に機能するようになります。画像パスを取得して関数に持ち込んだため、反復ごとに評価されますが、これが主なバグでした。

画像はすぐにはロードされないことに注意してください。トランジションごとに 1 に設定するのは賢明ではありません。実際には、それらすべてをバックグラウンドで目に見えない場所にプリロードする必要があります。これにより、即時のリコールが保証されます。

于 2013-04-10T09:38:33.167 に答える
0 
var imageName = "_Images/Image_0"+imageNumber+".jpg";

imageName番号が変わるたびに更新する必要があります。それ以外の場合、この文字列は Image_01.jpg に固定されます。

于 2013-04-10T09:35:58.227 に答える
0

imageName変数が更新されることはありません。各 chageImage 呼び出しで更新する必要があります。

var imageId = document.getElementById("slideShowImage");
var imageNumber = 1;
var imageName = "_Images/Image_0"+imageNumber+".jpg";

function changeImage (){
    imageNumber++;
    imageName = "_Images/Image_0"+imageNumber+".jpg";
    imageId.setAttribute("Src",imageName);
    if (imageNumber==7){
        imageNumber=1;
    }
}
setInterval(changeImage,1000);
于 2013-04-10T09:37:37.970 に答える
0

コードを置き換えることができます imageId.setAttribute("Src",imageName); 次の imageId.src = imageName; を使用します。

于 2013-04-10T09:44:43.973 に答える