Question

我在主页上有一个滑块，我正在尝试使用Ajax点击按钮加载其中的下五个帖子。当我使用Jquery .post加载下五个帖子的html时，滑块消失。原因是一个名为“slider.js”的脚本对新添加的html不起作用。我尝试使用.live（），但它不起作用，我可以在我的控制台中看到Ajax调用的响应，所以我知道呼叫正在工作。我尝试在Ajax响应中包含js文件，但即使这样也不会触发。 js文件是一个包含很多函数的长文件，我不能将它放在一个函数中，如论坛上的某些人所建议的那样。我将如何重新加载slider.js以使其工作？这是ajax .post（）代码。

$(function() { 

   $('.nextfive').live('click', function() { 

      var data = {action: 'next_five',next: 5};

      jQuery.post("<?php echo admin_url('admin-ajax.php'); ?>", data,

      function(response) {

             $('#navi').slideDown("slow");  
             $("#slidercontainer").html(response); 

          },"html");   

      }); 
});

修改：检查http://axactsoft.com/samplewp/处的页面，然后点击顶部的按钮“点击五次”。文件代码粘贴在http://pastebin.com/4iS6Ey10

Answer 1

试试这个：

$('.nextfive').on({ 

    click: function () {

              var data = {action: 'next_five',next: 5};

              $.post("<?php echo admin_url('admin-ajax.php'); ?>", data,

              function (response) {

                 $('#navi').slideDown("slow");  
                 $("#slidercontainer").html(response);
              }
     }    

}, 'body');

您必须使用jquery 1.7或更高版本才能使用.on（）函数。如果没有看到你正在使用的所有div ID的HTML结构，很难知道你在做什么。

我还建议拆分代码：你有一个事件处理程序，它为ajax保存一个函数，它本身就是一个函数来处理ajax回调。我有事件处理程序处理事件并将参数传递给另一个只处理ajax的函数，并让该函数调用一个只处理ajax响应处理的函数。你应该在同一范围内使用3个函数，而不是将3个函数嵌套在一起。

Answer 2

你使用的是什么slider.js？在从php脚本获取数据后，您可以添加一个事件侦听器来重新初始化滑块。这样的东西，虽然它会根据滑块的工作方式而有所不同。

$('.nextfive').click(function () {
    $.get("<?php echo admin_url('admin-ajax.php'); ?>",
          {action :'next_five', next   : 5},
          function (resp) {
              $('#navi').slideDown("slow");  
              $("#slidercontainer").html(response)
              $("#slidercontainer").slider(); /* This will change depending on
                                               * the library you are using */
    });
})

另外，关于编码风格的一些事情：

当您获得下五个帖子等数据且不修改数据时，请始终使用GET而不是POST。通常，除非您在服务器上修改某些内容，否则总是使用GET，在这种情况下，您使用POST。
jQuery。*可以替换为$。*，请参阅上面的示例。
将单击处理程序附加到元素的最简单方法（即在单击某些内容时发生某些事情）是在jQuery中使用$（elem）.click（）函数，请参阅我的示例。

如果您提供有关您正在使用的滑块的更多详细信息，我可以提供更具体的代码。

Ajs调用后Js无法正常工作

2 个答案: