Question

//deep linking 
$.fn.ajaxAnim = function() {
    $(this).animW();
    $(this).html('<div class="load-prog">loading...</div>');
}

$("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, 
                beforeSend: function(){$(contM).ajaxAnim();},
                type: "POST",
                dataType: 'html',
                data: {post_loader: 1},
                success: function(data){
                    $(contM).html(data);
                    $('.post-content').initializeScroll();
                    }
        });
    }

    // Event handlers
    $.address.init(function(event) {
        //console.log("init: " + $('[rel=address:' + event.value + ']').attr('href'));
    }).change(function(event) {
        evVal = event.value;
        if(evVal == '/'){return false;}
        else{
            $.ajax({ url: $('[rel=address:' + evVal + ']').attr('href'), 
                    beforeSend: function(){$(contM).ajaxAnim();},
                    type: "POST",
                    dataType: 'html',
                    data: {post_loader: 1},
                    success: function(data){
                        $(contM).html(data);
                        $('.post-content').initializeScroll();
            }});
        }
        //console.log("change");
    })

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

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

});

我正在使用jquery地址来更新内容，同时保持有用的网址。单击主导航中的链接时，URL会正确更新，但是当使用ajax动态加载链接时，URL地址功能会中断。

我已经实现了“点击”事件，允许通过动态加载的链接加载内容，但我似乎无法使地址事件监听器生效，但这似乎是使这项工作的唯一方法。如果我改变这个，我的语法是错误的：

$.address.change(function(event) {

到此：

$.address.live('change', function(event) {

或者live方法不适用于这个插件吗？

Answer 1

进入jquery地址插件文件并替换了这一行：

$.fn.address = function (fn) {
    $(this).click(function() {

用这个：

 $.fn.address = function (fn) {
        $(this).live('click',function() {

使所有动态加载的链接响应地址插件事件侦听器

Answer 2

live方法仅适用于jquery dom元素。不是插件。

live方法检测dom元素是否动态添加到HTML并将事件绑定到它。您要说的是：“如果html上出现”地址“插件，请将事件”更改“绑定到它”。 “地址”插件是不是dom元素，它不起作用。

Answer 3

首先，简短回答：不，它不起作用：）

为什么部分：.live()处理事件，它不关心它们是否是自定义等（在大多数情况下）。热门工作就是你打电话给.live()，例如：

$(".myThing").live('click', functionToRun);

.live()在DOM的根目录创建一个事件处理程序，等待事件冒泡到它。重要的部分：新元素或旧元素以相同的方式冒泡事件，无论它们是如何加载的。当事件冒泡并到达DOM根目录时，.live()事件处理程序检查它们的选择器是否与具有该事件的元素匹配，如果是，则执行它们。

使用插件你想说新的东西并在其上运行代码......你可以看到这与.live()实际上在内部的工作方式有很大的不同。

jquery地址和实时方法

3 个答案: