与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请求后触发事件

回答

相关问题