jquery - jquery html() コールバック関数

Question

この質問は数回尋ねられましたが、私の特定の問題に役立つような方法で回答されていません. ナビゲーション リストからアイテムをクリックすると、.html()関数を使用して HTML コンテンツを div にロードしています。ajax リクエストはありません。HTML コンテンツには画像があります。そのため、ロードするのに少し時間がかかる場合があります。は.html()同期操作であるため、次の行がすぐに実行されます。

を使用してコンテンツをロードするとすぐに、.html()tinyscrollbar というサードパーティのカスタム スクロールバーが有効になります。ロードされたコンテンツに画像が含まれている場合、スクロールバーは画像がロードされる少し前にコンテンツ div の高さを計算するため、スクロールバーが完全にスクロールされません。

使いたくありません.setInterval()。これに対する解決策はありますか？.html()関数のように機能するが、ある種のコールバック機能を持つjQuery の他の関数はありますか?

ありがとうございました。

Answer 1

$('#divId').html(someText).promise().done(function(){
    //your callback logic / code here
});

Answer 2

Mike Robinson (および dystroy の) の提案に基づいて、私の質問に対する答えは次のとおりです。

$("#myContentDiv").html('HTML content comes here');
var contentImages = $("#myContentDiv img");
    var totalImages = contentImages.length;
    var loadedImages = 0;
    contentImages.each(function(){
        $(this).on('load', function(){
            loadedImages++;
            if(loadedImages == totalImages)
            {
                $("#myContentDiv").tinyscrollbar();
            }
        });
    });

Answer 3

画像がロードされたかどうかを確認するには、次を使用できます。

<img src="your_image_path" />


<script>
    $('img').load(function() {
        //call_your_function();
    });
</script>

Answer 4

$(window).load(function() {
  // code here
})();