Question

我正在使用查询加载来获取内容并将其注入我的页面。这很好用，我已经使用了委托，所以我可以点击链接通过ajax然后另一个和另一个等加载内容。我的问题是我有一个自定义内置切换点击功能，在转到ajax加载页面后无法工作。为什么这样，我该如何解决？

$.fn.toggleClick = function () {
    var methods = arguments,
        count = methods.length;
    return this.each(function (i, item) {
        var index = 0;
        $(item).click(function () {
            return methods[index++ % count].apply(this, arguments);
        });
    });
};

$(window).load(function () {
    $(document).delegate('#nextPost, #prevPost, .open, .logo', 'click', function(e) {
        var postLink = $(this).attr('href');
        $('#middle').animate({opacity:0},300, function() {
            $(this).load(postLink + ' .teleport', function() {
                $(this).animate({opacity:1},300);
            });
        });
        e.preventDefault();
    });

    $('#moreLikeThis').toggleClick(function () {
        $('.more').slideDown(500);
        $('#moreLikeThis').text('Hide more like this');
    }, function () {
        $('.more').slideUp(500);
        $('#moreLikeThis').text('Show more like this');
    });
});

Answer 1

试试这个：

$.fn.toggleClick = function() {
    var methods = arguments,
        count = methods.length;
    return this.each(function(i, item) {
        var index = 0;
        $(item).click(function() {
            return methods[index++ % count].apply(this, arguments);
        });
    });
};

$(window).load(function() {

    function doToggles() {
        $('#moreLikeThis').unbind();
        $('#moreLikeThis').toggleClick(function() {
            $('.more').slideDown(500);
            $('#moreLikeThis').text('Hide more like this');
        }, function() {
            $('.more').slideUp(500);
            $('#moreLikeThis').text('Show more like this');
        });
    }

    $(document).delegate('#nextPost, #prevPost, .open, .logo', 'click', function(e) {
        var postLink = $(this).attr('href');
        $('#middle').animate({opacity: 0}, 300, function() {
            $(this).load(postLink + ' .teleport', function() {
                $(this).animate({opacity: 1}, 300);
                doToggles();
            });
        });
        e.preventDefault();
    });

    doToggles();
});

在动态向DOM添加内容后，您必须重新初始化侦听器。

使用查询加载后使函数工作

1 个答案: