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

你可以试试＆＃34; on＆＃34;听者

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

jQuery动态元素自动运行的每个方法

3 个答案: