在jQuery中向DOM添加新元素後，選擇器不工作

Question

我有一個ID爲'content'的div。進入這個div位於文本輸入和跨度與日期。進入跨度我寫了添加日期的內容。對於此跨度，我使用Timeago插件來每分鐘更新當前時間與添加的差異。當我更新這個內容時，jQuery不會選擇新添加的元素。我應該做什麼？這是代碼： HTML代碼：

<div id="content"> 
    <input id="text" type="text" name="yourName"/> 
    <button type="button" onclick="changeContent();">Change</button> 
    <span class="timeago" title="2014-03-30 20:04"></span> 
</div> 

Javascript代碼：

<script language="text/javascript"> 
    function changeContent() { 
     var content = $('#content'); 
     var value = $('#text').val(); 
     var spanElm = $('span.timeago'); 
     $.ajax({ 
      url:'/ajax/change.php', 
      dataType: "json", 
      type: "POST", 
      cache: false, 
      data: {"text":value}, 
      success: function (data) { 
       spanElm.remove(); 
       content.append(data); 
      } 
     }); 
    } 
    jQuery(function($) { 
     jQuery("span.timeago").timeago([]); 
    }); 
</script> 

阿賈克斯返回我有新的日期跨度元素。例如：<span class="timeago" title="2014-03-30 20:07"></span>。

Answer 1

使用此jQuery("span.timeago").timeago([]);裏面success回調。

因爲ajax本質上是異步的。

全碼：

<script language="text/javascript"> 
    function changeContent() { 
     var content = $('#content'); 
     var value = $('#text').val(); 
     var spanElm = $('span.timeago'); 
     $.ajax({ 
      url:'/ajax/change.php', 
      dataType: "json", 
      type: "POST", 
      cache: false, 
      data: {"text":value}, 
      success: function (data) { 
       spanElm.remove(); 
       content.append(data); 
       jQuery("span.timeago").timeago([]); 
      } 
     }); 
    } 
</script>