javascript - 在 ajax 调用后 - $(document).ready();?

Question

我有一个问题。这是我在页眉某处的内容

 $(document).ready(function(){
       $(".ajax").click(function(e){
       var url = $(this).attr("href");
       var url = url.split("##/");

       if (!url[1]){url[1]=" ";}
       var page = "http://<?php echo $_SERVER[SERVER_NAME]; ?>page.php?ajax=1&what="+url[0]+url[1];
       $("#content").load(page);

       var kkk = 'Asdasdasd';
       });
 });

因此，在点击 <a href="##/new_page" class="ajax">new</a> 之后, 内容正在填充:

<script> alert(kkk); </script>
<a href="##/old_page" class="ajax">old page</a>

但是，警报没有被考虑在内，因为新页面没有看到 kkk，并且在原始页面上有效的链接也没有。为什么？

Answer 1

为了使链接在再次加载后能够正常工作，您可能需要一个实时事件。这将监视任何具有 ajax 类的新对象，而不仅仅是加载原始文档时存在的对象。如果您需要设置其他任何东西(通常在文档内部就绪)，请将其作为第二个参数放入匿名函数中 load() 因为它不能保证加载新的内容却不然。例如:

   $(".ajax").live('click', function(e){
   var url = $(this).attr("href");
   var url = url.split("##/");

   if (!url[1]){url[1]=" ";}
   var page = "http://<?php echo $_SERVER[SERVER_NAME]; ?>page.php?ajax=1&what="+url[0]+url[1];
   $("#content").load(page, function () { var kkk = 'Asdasdasd'; });

   });

或者正如@Levi 指出的那样，一个 .delegate 调用可以完成同样的事情，同时减少浪费:$('content').delegate('.ajax', 'click', function() (...)