为什么这段代码没有加载页面ajax jquery

why this code is not loading pages ajax jquery

本文关键字：加载 jquery ajax 段代码代码为什么更新时间：2023-09-26

Guys我想做的是用ajax在导航点击时加载一个页面，并在加载过程中添加一些延迟当什么都没有点击时，我想在用jquery加载动画和用PHP代码延迟后加载主页如果导航上的某个东西被点击，我想加载那个特定的文件但这个代码似乎不起作用

var res = {
    loader: $('<div />', {class: 'loader' } ),
    container: $('.content')
};
$(document).ready(function(){
            $.ajax({
                url: 'templates/delay.php',
                beforeSend, function(){
                    res.container.append(res.loader);
                },
                success, function(){
                    res.container.find(res.loader).remove();
                    $('.content').load('templates/pages/home.php');
                }
            });
            $('ul#nav_a li a').click(function(){
                $.ajax({
                url: 'templates/delay.php',
                beforeSend, function(){
                    res.container.append(res.loader);
                },
                success, function(){
                    res.container.find(res.loader).remove();
                    var page=$(this).attr('href');
                    $('.content').load('templates/pages/'+page+'.php');
                        return false;
                    });
            });
                }
            });

我不会讨论代码本身，只是改进它。

试试这个代码，如果你得到了你想要的，告诉我：（js代码中的注释）

$(document).ready(function(){
    $.ajax({
        url: 'templates/delay.php',     
        // old code : beforeSend,
        beforeSend: function(){
            res.container.append(res.loader);
        },
        // old code : success,
        success: function(){
            res.container.find(res.loader).remove();
            $('.content').load('templates/pages/home.php');
        }
        // beforeSend and success are keys with functions as values that's why we use ":" and not ","
        // the "," comma is used to separate ajax settings
    });
    $('ul#nav_a li a').click(function(){
        var page = $(this).attr('href');
        $.ajax({
            url: 'templates/delay.php',
            // old code : beforeSend,
            beforeSend: function(){
                res.container.append(res.loader);
            },
            // old code : success,
            success: function(){
                res.container.find(res.loader).remove();                    
                $('.content').load('templates/pages/'+page+'.php'); 
            // old code
            //  return false;
            //  });
            // we close our ajax.success function
            }
        })
        // old code
        // }
        // return false is used to prevent browser to run the a href that's why we use it in the a.click function and not inside the ajax block
        return false;
    })
})

var res = {
    loader: $('<div />', {class: 'loader' } ),
    container: $('.content')
};
$(document).ready(function(){
        res.container.append(res.loader);
        $('.content').load( "templates/pages/home.php", function() {
             res.container.find(res.loader).remove();
        });
        $('ul#nav_a li a').click(function(){
            var page=$(this).attr('href');
            $('.content').load( 'templates/pages/'+page+'.php', function() {
                res.container.find(res.loader).remove();
             });
        });
     }
 });

只需复制并粘贴即可。