0

すべてのjsスクリプトは機能していますが、これは機能していません

 $("img").each(function() {
      if ($(this).height() > 100) {
        return $(this).after("<p class='tasr'>FOTO © TASR</p>");
      }
    });

ページをロードすると機能しませんが、このスクリプトをコピーしてchrome-consoleを実行すると、完全に機能します。

私のコーヒースクリプト:

jQuery $(document).ready -> 
    $("img").each ->
        if $(this).height() > 100
            $(this).after("<p class='tasr'>FOTO © TASR</p>")

編集:

これは私の汚いコードです:coffeescriptからの私のjavascriptコード

4

1 に答える 1

3

これは、画像の読み込みがまだ完了していないため、高さと幅が0になっていることが原因である可能性があります。

.load()画像が読み込まれるとトリガーされるため、幅と高さが0より大きい関数を画像で使用することをお勧めします。

これは、それまでに画像が読み込まれるため、Chromeコンソールで機能している理由も説明します。

編集:以下のコメントで@zzzzBovが言及する価値のあることは、ブラウザのキャッシュが、標準の更新でロード関数を呼び出すイメージを停止することが多いということです。これを回避するには、.load関数とdocumentready関数の両方から呼び出すすべてのコードを含む関数が必要です。

これがあなたのhtmlの場合:

<img id="img1" src="example.jpg" />

次に、スクリプトでこれに沿って何かを書くことができます。これは頭​​のてっぺんから外れているので、少し間違っている可能性があることに注意してください。

function doStuff() {
    //I normally do a check here to see if the image width/height is 0 if it is then I dont bother
    //executing the rest

    //I do however sometimes need to do stuff when the image has not yet loaded which can be done here.

    //do stuff with the image, you could also pass parameters if needed.
}

$(document).ready(function() {
    doStuff();
});

$('#img1').load(function() {
    doStuff();
});
于 2012-07-13T18:13:44.030 に答える