来自加载 ajax 的链接的 jquery ajax 调用

标签 jquery ajax wordpress load

//deep linking 

$("document").ready(function(){
    contM = $('#main-content');
    contS = $('#second-content');
    $(contM).hide();
    $(contM).addClass('hidden');
    $(contS).hide();
    $(contS).addClass('hidden');
    function loadURL(URL) {
        //console.log("loadURL: " + URL);
        $.ajax({ url: URL, 
                type: "POST",
                dataType: 'html',
                data: {post_loader: 1},
                success: function(data){
                    $(contM).html(data);
                    $(contM).animW();
                    }
        });
    }

    // Event handlers
    $.address.init(function(event) {
        //console.log("init: " + $('[rel=address:' + event.value + ']').attr('href'));
    }).change(function(event) {
        $.ajax({ url: $('[rel=address:' + event.value + ']').attr('href'), 
                type: "POST",
                dataType: 'html',
                data: {post_loader: 1},
                success: function(data){
                    $(contM).html(data);
                    $(contM).animW();
        }});
        //console.log("change");
    })

    $('.update-main a').live('click', function(){
        loadURL($(this).attr('href'));
    });

  $(".update-second a").live('click', function() {
    var link = $(this);
        $.ajax({ url: link.attr("href"), 
                dataType: 'html',
                data: {post_loader: 1},
                success: function(data){
                    $(contS).html(data);
                    $(contS).animW();
        }});
  });

});

我正在使用 jquery 和“addresses”插件通过 ajax 加载内容并维护分页。我遇到的问题是一些带有链接的内容加载,这些链接旨在将内容加载到辅助窗口中。

我使用 .live() 方法来允许 jquery 监听加载到主要内容 div 中的新链接。

这一直有效,直到为这些加载了 ajax 的新链接调用 .ajax() 方法为止,该方法从这里开始,但在接收数据之前遵循原始链接。我假设问题出在客户端脚本中,但可能是对服务器的调用出现问题。我使用 wordpress 循环来解析 url 并生成通过 jquery 加载的 html。

感谢您的任何提示!

最佳答案

问题是当您单击 <a> 时,您的浏览器显示“嘿,去那里”...需要在脚本中添加 return false; 来停止此行为(或 e.preventDefault(); ),如下所示:

$('.update-main a').live('click', function(){
    loadURL($(this).attr('href'));
    return false;
});

$(".update-second a").live('click', function() {
  var link = $(this);
    $.ajax({ url: link.attr("href"), 
            dataType: 'html',
            data: {post_loader: 1},
            success: function(data){
                $(contS).html(data);
                $(contS).animW();
    }});
    return false;
});

另一种格式是这样的:

$('.update-main a').live('click', function(e){
    loadURL($(this).attr('href'));
    e.preventDefault();
});

关于来自加载 ajax 的链接的 jquery ajax 调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2550020/

相关文章:

javascript - 如何在 Android 3.1 上以编程方式滚动 HTML DIV?

javascript - ajax返回时的 Angular 加载路由

php - WooCommerce 结帐单选按钮,根据特定项目小计设置百分比费用

c# - ViewModel 中的类似属性名称未在 Controller 操作方法中绑定(bind)

php - 如何在 WordPress 插件中使用命名空间和类

JavaScript 不在外部域上执行

css - 如何使菜单按钮在移动 wordpress 网站上可见?

javascript - 修改 Google Maps Api 以显示基于国家/城市名称而不是 LatLng 的标记

javascript - 为什么即使用户不存在于 parse.com 数据库中,JavaScript 查询结果也总是成功?

javascript - 使用 jquery 单击输入类型按钮时如何更改 Canvas 背景图像?