父容器的ajax重新加载后链接停止工作

Posted 2023-02-24

【中文标题】父容器的ajax重新加载后链接停止工作

【英文标题】：Link stops working after ajax reload of parent container

【发布时间】：2011-05-05 10:09:52

【问题描述】：

在我的页面 (LINK) 上，我想添加以前添加的视频的 ajax 分页列表。该列表工作正常，直到我转到下一页。然后，即使我正在使用 livequery，整个事情也会停止反应。即使将父 div 引入更新的 div 也不能解决问题。任何想法发生了什么？

父容器：

    <div id="videos-wrapper">
        <div class="videos-list">
            <h3>Previous Videos</h3>
            DATA  GOES HERE
        </div>
    </div>

更新的html：

<ul id="videos- page ">
    % for obj in objects %
        <li>
            <a href="#" class=" obj.id ">
                <img src="obj.video.thumbnail_url"  />
            </a>
        </li>
    % endfor %
</ul>

% if prev %
    <a href="#" class="vid-navi">
        <span class=" prev ">prev</span>
    </a>
% endif %    

% if next %
    <a href="#" class="vid-navi">   
        <span class=" next ">next</span>  
    </a>
% endif %

js:

$('#videos-wrapper .vid-navi').livequery('click', function(e) 
    e.preventDefault();
    var page = $("span", this).attr('class');

    alert("GO");

    $.ajax(
        type: "POST",
        url: "/play-forward/change-page",
        data: "page=" + page,
        dataType: "json",
        success: function(data)
            $('.videos-list').html(data['html']);
        
    );
    return false;
);

【参考方案1】：

我一直使用 jQuery 的原生 live() 来执行此操作。看起来像是一个简单的交换你在这里的东西。

http://api.jquery.com/live/

【讨论】：

嗯，它有效。但是为什么附加功能（应该比内置功能更好）在这里不起作用？没有实际需要，我用得太急了？

livequery 比 jQuery 核心早几年就有这个能力，但是那个时候 jQuery 核心团队一直在努力工作。我自己也很久没有使用 livequery 了。