2

jQuery メソッド.width()を使用して、生成された要素の幅を次のように取得しました。

html: 
<div class='row-fluid' id='photo-preview'></div>
javascript:
 for(i = 0;i < 4;i++){
    var imageSpan = "<div class='span3' id='span_" + i + "'><img src='" + images[i] +"'></div>"
    $('#photo-preview').append(imageSpan);
    var w = $('#span_' + i).width(); 
    console.log(w);
  }

しかし、幅の値が正しくありません。ピクセルではなくパーセンテージの値でした。たとえば、w400 (400px) である必要がありますが、js は 80 (80%) になりました。

要素が動的に生成されたため、問題が発生した可能性があると思いました。.width()コンソールでは、すべての要素がロードされたときに正しい値を取得できます。

それを回避するためのアイデアはありますか?

4

2 に答える 2

4

正しい高さを取得するには、画像の読み込みイベントを待つ必要があります。

var img = '<img src="img_path.jpg">';
$(img)
    .load(function() {
        console.log("width", $(this).width());
    })
    .appendTo('#photo-preview');

編集:あなたの例と一致させるために:

html: 
<div class='row-fluid' id='photo-preview'></div>
javascript:
 for(i = 0;i < 4;i++){
    var img = "<img src='" + images[i] +"'>";
    $(img)
        .load(function() {
            console.log("width", $(this).width());
        })
        .appendTo("<div class='row-fluid' id='photo-preview'>")
        .appendTo('#photo-preview');

  }
于 2013-01-12T23:14:30.813 に答える
-1

offsetWidthを使用してみてください

IE

var w =  $('#span_' + i).offsetWidth;
console.log(w);

これは私が作った本当にばかげたフィドルです。幅を 80% に設定しました。コンソールに移動すると、ピクセル幅 (448 ピクセル) が表示されます。

http://jsfiddle.net/bwm5s/

于 2013-01-12T23:06:38.830 に答える