jQuery動的要素の各メソッド自動実行

Question

$('body').on('click', function() { 
    $('.detailTextContainer a').each(function() { 
    var urlFoto = $(this).attr('href'); 
    var imgElement = $("<img />").attr('src', urlFoto) 
           .addClass('dalsiFoto'); 

    $(this).empty().append(imgElement); 
    }); 
}); 

ロードするページ（イベントなし）後にこの機能を自動的に実行する方法を教えてください。 '.detailTextContainer a'は動的要素で、開始ページの直後にページに読み込まれます。

私はこのコードを試してみました：

function showImage(){ 
    $('.detailFeatureDesc a').each(function() { 
    var urlFoto = $(this).attr('href'); 
    var imgElement = $("<img />").attr('src', urlFoto) 
           .addClass('dalsiFoto'); 
    $(this).empty().append(imgElement); 
    }); 
}; 

showImage(); 

をしかし、これは成功しませんでした。

おかげ

Answer 1

あなたはload機能を使用することができます。ページは、グラフィックスを含む完全にロードされたときにドキュメントから

$(window).load(function() { 

     // create detailTextContainer here 
     $('.detailTextContainer a').each(function() { 
      var urlFoto = $(this).attr('href'); 
      var imgElement = $("<img />").attr('src', urlFoto) 
              .addClass('dalsiFoto'); 

     $(this).empty().append(imgElement); 

     }); 

}); 

は、この機能を実行します。

それとも、使用することができます。

$(document).ready(function() { 

}); 

や速記は：

$(function() { 

}); 

これが唯一のページドキュメントオブジェクトモデル（DOM）後に実行されるJavaScriptコードを実行するために準備ができています。

Answer 2

あなたは、単にウィンドウのロード機能で関数を記述する必要があります

<script> 
$(document).ready(function() { 
    console.log("document loaded"); 
}); 

$(window).on("load", function() { 
    //write your code is given section 
}); 
</script> 

Answer 3

リスナー "オン" にしてみてください

$(document).on("click", ".detailTextContainer a", function() { 
    // your code 
});