-1

画像の正しいサイズを取得できません

HTMLは次のとおりです。

<img id="image" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif"
    height="20">


<div id="result"></div>
correct result: 76

そしてJavaScript：

var v1 = $('#image').height();
var v2 = $('#image').removeAttr('height').height();
var i =  $('<img>').attr('src',  $('#image').attr('src'));
var v3 = i.height()

i.one('load', function() {
    var v4 = $(this).height();
    $('#result').text(v1 + " " + v2 + " " + v3 + " " + v4);
}).each(function() {
    if(this.complete) {
        $(this).load();
    }
});

4つの方法を使用しましたが、すべて失敗しました。
更新:方法 2 は機能しますが、スクリプトの実行時に画像が読み込まれない可能性があるため、方法 4 を使用したいと考えています。

リンクのテスト: http://jsfiddle.net/cMZK7/7/

4

9 に答える 9

2

画像自体ではなく、画像がある DIV を参照しています。

于 2012-07-21T14:56:19.157 に答える
1

div最初の 2 つは、 ではなく周囲の高さを取得していimgます。

console.log($('img').height(), $('img').width())画像の正しいサイズである 20px と 88px が表示されます

于 2012-07-21T15:00:57.233 に答える
1

よくわかりませんが、ポイントが高さ属性の値を見つけることである場合、これは機能します：

var height = $("#image img").prop('height');

画像の実際の高さを取得するには、CSS などで設定した高さではなく、画像の実際の高さを意味します。

var img = new Image();
    img.src = ​$('img', '#image')[0]​.src;
    img.onload = function() {
        $("#result").html(img.height);
    }

フィドル

古いバージョンの IE では、画像がキャッシュされるときに onload イベントで問題が発生します。

于 2012-07-21T15:08:42.470 に答える
1

問題は、イベントのsrc前に属性を設定している可能性があります。load多くのブラウザーでは、これによりイベント ハンドラーが起動しなくなります。

于 2012-07-21T14:56:19.687 に答える
1

画像のIDでdivの高さを取得するのではなく、そのdiv内の画像の高さを取得しているように見えます。これを試して：

var v1 = $('#image img').height();
于 2012-07-21T14:57:47.937 に答える
1

属性を削除し、 (イベントheightを使用して) 画像が読み込まれるまで待つ必要があります。load

または、新しい画像オブジェクトを作成し、同じ画像をそこにロードして、画像がロードされるまで待ちます。

于 2012-07-21T15:00:01.893 に答える
1

これを試して、

<img id="image" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" />

<script>
$("#image").load(function() {

    alert($("#image").height()); // Alerts 76
    });  

</script>    
​

ここでフィドルhttp://jsfiddle.net/FgrQW/1/

于 2012-07-21T15:10:25.150 に答える
0

完全な正解：https ：//stackoverflow.com/a/1944298/966972

（この質問に対するコメントには含まれていましたが、回答には含まれていませんでした）

于 2012-08-04T10:54:01.713 に答える
0

試す

$('<img>').get()[0].height;
于 2012-07-21T14:57:59.083 に答える