0

コントローラーからビューに送信される画像を表示しようとしています。ビューページで画像を表示したいのですが、これらの画像を繰り返すために「進む」と「戻る」の2つのボタンがあります。

//controller:
var images= [path1 , path2, path3];
var currentImageIndex=0;
function goToNextImage() { // is called when forth button is clicked
   if (currentImageIndex +1 < images.length) {
      currentImageIndex ++;
       imageDisplay= ImageDisplay(images, currentImageIndex);
   }
}

$(document).ready(function() {
   imageDisplay= ImageDisplay(images, currentImageIndex);
   $('body').append(imageDisplay);
});

// インデックス ファイルの本文が空です。javascriptファイルから本文にすべてを追加します

// view (javascript file)

function ImageDisplay(images,currentImageIndex) {
var me = $('<div/>');
   drawImage();


 function drawImage( ) {
      var windowWidth= $(window).width();
      var windowHeight=$(window).height();
      var imageSrc= images[currentImageIndex];
      var image = $ ('<img id="img" src="'+imageSrc+'" alt="NO IMAGE" width="'+windowWidth/2+ '" height= "'+windowHeight/2+'" class="image_display"/>');
      console.log("image source= "+imageSrc);

    me.append(image);
}
return me ;
}

問題は、表示される画像が常に同じであることです (画像ソースは変わりますが)。私はここを読みます新しいソースを設定するために使用する必要があるjavascript で画像ソースを変更します。document.getElementById("img").srcしかし、HTML ファイルに img ID がないため、「null のプロパティ src を設定できません」というエラーが発生しました。

ご協力ありがとう御座います!

4

1 に答える 1

1

var me = $('<div/>');基本的に(読んでください:実際に)新しいノードを作成しています。そのノードにコンテンツを追加していますが、実際に DOM に追加することはありません。おそらく次のような意味です。

var newImage = ImageDisplay(images, currentImageIndex);
imageDisplay.replaceWith(newImage)
imageDisplay = newImage;

imageDisplayとはいえ、DOM 内で値を割り当てたことがあるかどうかはわかりません。そうでない場合は、その値を初期化する必要がある場合があります。

于 2013-08-19T17:18:10.423 に答える