通过 ajax 加载的链接将不会通过 ajax 加载答案

【问题标题】：Links loaded via ajax won't then load via ajax通过 ajax 加载的链接将不会通过 ajax 加载
【发布时间】：2016-04-16 23:18:55
【问题描述】：

我正在创建一个 ajax 加载站点，这是一个新手，并且正在努力处理通过 .load 方法加载到容器中的链接，然后在单击时不会以相同的方式运行......他们只是加载页面作为 html 标准。

如果重要的话，我会使用 wordpress 作为 cms 并从永久链接加载页面。

我正在使用类似的东西：

$(document).ready(function() {

    $('a.ajax').click(function(){

        var toLoad = $(this).attr('href')+' .content';

        $('.ajax-wrapper').animate( {opacity: 0}, 1000, function() {

            $('.content').load(toLoad,'',function() {

                $('.ajax-wrapper').animate( {opacity: 1}, 1000);

            });

        });

        return false;

    });
});

【问题讨论】：

您在 ajax-wrapper.animate 附近出现语法错误
谢谢，已修复该错误

标签： jquery ajax wordpress

【解决方案1】：

$('body').on('click', 'a.ajax', function (e){


        var toLoad = $(this).attr('href')+' .content';

        $('.ajax-wrapper').animate( {opacity: 0}, 1000, function() {

            $('.content').load(toLoad,'',function() {

                $('.ajax-wrapper').animate( {opacity: 1}, 1000);

            });

        });

        return false;


        });

【讨论】：

【解决方案2】：

您需要的可能是事件委托，基本上您将事件绑定到在文档生命周期中保持可用的元素

$(document).on('a.ajax', 'click', function(){

    var toLoad = $(this).attr('href')+' .content';

    $('.ajax-wrapper').animate( {opacity: 0}, 1000, function() {

        $('.content').load(toLoad,'',function() {

            $('.ajax-wrapper').animate( {opacity: 1}, 1000);

        });

    });

    return false;

});

【讨论】：

【解决方案3】：

您可能只需要 event.preventDefault()，该事件是单击侦听器函数的参数。文档：https://api.jquery.com/event.preventdefault/

【讨论】：

是的，return false; 不会在 a 标记的这种情况下停止传播。 reading