與jQuery的ajax請求後觸發事件

我有一個包含jQuery腳本和AJAX請求的HTML頁面。在我的頁面上，我有一些帶有類'loading_span'的span元素。點擊一個href，就會執行一個ajax進程。該過程還會生成一些類：'loading_span'。問題是我的jQuery腳本不會通過ajax請求觸發新添加的span元素。與jQuery的ajax請求後觸發事件

問題是：爲什麼我的腳本沒有看到添加了類'loading_span'的新元素？

在followong我會貼上我的代碼：

/* file js/javascript.js */ 
$(document).ready(function() { 

    $.ajaxSetup ({ 
     cache: false 
    }); 

    $('#show-more').click(function() { 
    $.ajax({ 
     url: $(this).attr('href'), 
     success: function(msg){ 
      $('#all_span').append().html(msg); 
     }, 
     dataType: "Html" 
    }); 
    return false; 
}); 


    $('.loading_span').each(function(index, span){ 
     console.log($(this).attr('id')); 
    }); 
});

index.php文件：

<head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
     <script src="js/script.js" ></script> 
     <style type="text/css"> 
      .loading_span { 
       display: list-item; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="all_span"> 
     <?php 

     for($i=0;$i<5;$i++) 
      echo "<span class='loading_span' id='id$i'>span$i</span>"; 
     ?> 
      <a href="ajax.php" id="show-more">show_more</a> 
     </div> 
    </body>

和ajax.pho文件內容

for ($i = 0; $i < 5; $i++) 
    echo "<span class='loading_span' id='ajax$i'>ajax$i</span>";

來源

2012-07-15 dole doug

你問爲什麼你的代碼有（'$（」。loading_span '）。每個......'）都不會抓住他們？ – j08691 2012-07-15 13:24:20

@ j08691：是的。這是我的問題。 – 2012-07-15 15:48:57

您應該使用

$('#all_span').append(msg);

，而不是

$('#all_span').append().html(msg);

，改變你的成功回調至

success: function(msg){ 
     $('#all_span').append(msg); 
     $('.loading_span').each(function(index, span){ 
      console.log($(this).attr('id')); 
     }); 
},

來源

2012-07-15 17:49:16

TY太多了。方法很清楚。 – 2012-07-15 18:09:28

不客氣:-) – 2012-07-15 18:10:02

你可以在元素之後使用在load_span之後添加元素。

請參閱下面的url for Javascript部分。 http://jsfiddle.net/vkTHK/1/

我仍然不知道你想達到什麼。如果它不能滿足你的需要，請詳細說明部分或提供JS小提琴URL，這樣我可以提供幫助。

來源

2012-07-15 14:34:09 user1269989

TY爲您的答覆，但我需要應用$（'。loading_span'）。函數each（）; – 2012-07-15 15:47:49

您的$('.loading_span').each...在您的AJAX調用完成之前執行，這就是爲什麼它正在做它正在做的事情。您可以將該代碼移動到AJAX調用的success事件中，以便在新元素添加到DOM後應用該代碼。

來源

2012-07-15 17:28:01 j08691

與jQuery的ajax請求後觸發事件

回答

相關問題