Question

我有一个ajax脚本，根据链接

用已加载的页面替换我的#main内容

示例：rddd将替换#main并将其替换为about.php

的内容

虽然我的问题是它工作正常但其他一切如果我在about.php示例lala.php中有一个链接然后我得到它加载[通过按下另一个链接就像我们对about.php所做的那样以上]，我无法在ajax中加载lala.php链接，而是将我带到页面而不是替换#main。

我尝试了很多东西，甚至从导航中复制了确切的代码，仍然无法工作。除了#main

之外，它还可以在其他任何地方使用

我的javascript：

$(document).ready(function() {

        var hash = window.location.hash.substr(1);
    var href = $('#ajax a').each(function(){
        var href = $(this).attr('href');
        if(hash==href.substr(0,href.length-5)){
            var toLoad = hash+'.html #main';
            $('#main').load(toLoad)
        }                                           
    });


    $('#ajax a').click(function(){

        var toLoad = $(this).attr('href')+' #main';
        $('#main').fadeOut('normal',loadmain);
        $('#load').remove();
        $('#wrapper').append('<span id="load">LOADING...</span>');
        $('#load').fadeIn('normal');
        window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
        function loadmain() {
            $('#main').load(toLoad,'',showNewmain())
        }
        function showNewmain() {
            $('#main').fadeIn('normal',hideLoader());
        }
        function hideLoader() {
            $('#load').fadeOut('normal');
        }
        return false;

    });

});

Answer 1

您的问题是事件处理程序。当您的$('#ajax a').click()函数运行时，它们仅将事件处理程序绑定到已存在的元素。因此，您的Ajax加载器适用于about页面的链接 - 事件处理程序触发 - 但不适用于about页面上的链接。创建事件处理程序时，它们不是DOM的一部分。

您可以通过更改事件处理程序来侦听文档，而不是：

$(document).on('click', '#ajax a', function() { 
    // Callback function here.
});

如果加载链接，Ajax加载内容将无法工作

1 个答案: