【问题标题】:jquery ajax call from link loaded with ajax来自加载了ajax的链接的jquery ajax调用
【发布时间】:2010-03-31 02:15:41
【问题描述】:
//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 和“地址”插件通过 ajax 加载内容并保持分页。我遇到的问题是一些带有链接的内容加载,这些链接旨在将内容加载到辅助窗口中。

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

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

感谢您的任何提示!

【问题讨论】:

    标签: jquery ajax wordpress load


    【解决方案1】:

    问题是当您单击<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();
    });
    

    【讨论】:

    • +1 - 我还想补充一点,click 事件默认是实时的,所以不需要live('click', fn),只需el.click(fn) 即可。
    • 另外,我一开始没有使用 live 方法,但是事件监听器没有识别出加载了 ajax 的链接
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-04-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-04-05
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多