使用 AJAX 从其他页面加载内容


load content from other page with ajax

我有一个基于帖子的WordPress网站,但我想用ajax过滤我的帖子。

棘手的部分是,如果我想从"案例"过滤到"摄影",我有两个不同的模板。

我可以用一点 php 来管理它并更改the_template_part,但这会使页面重新加载,这是我不想做的。

我一直在尝试执行 ajax 请求以完成过滤器功能。

我的.js

   $('a[rel="filter"]').click(function() {
        var filter = $(this).attr('id');
        $('.checked').removeClass('checked');
        $(this).parent().addClass('checked');
        $.ajax({
            url: '/wp-admin/admin-ajax.php',
            data: window.location = '#?filter=' + filter,
            success: function() {
                $('#content').children().fadeOut(549);
                $('#content').html(data).fadeIn(549);
            }
        });
        console.log('Filter ' + $(this).attr('id') + ' clicked');
    });

这是更改索引中template_part的 php.php

    $type = ($_GET['filter'] == '') ? 'projects' : $_GET['filter'];
    <?php 
       get_template_part($type); 
    ?>  

我能做到这一点还是我需要考虑一下?

这只以纯文本形式返回实际地址

    $('a[rel="filter"]').click(function() {
        var filter = $(this).attr('href');
        $('.checked').removeClass('checked');
        $(this).parent().addClass('checked');
        $.ajax({
            url: 'wp-admin/admin-ajax.php',
            //url: 'url' + filter,
            data: {
                filter: filter
            },
            success: function(html) {
                $('#content').children().fadeOut(549);
                $('#content').html(filter).fadeIn(549);
                console.log(filter);
                console.log("Success");
            },
            error: function() {
                console.log('No can do')
            }
        });
        console.log('Filter ' + filter + ' clicked');
        return false;
    });

如果我有 3 个页面,其中包含不同的查询和模板,这些查询和模板代表(案例、摄影和运动),我想在首页上使其可过滤。我正在一个单页网站上工作。

在单击函数结束时添加返回 false。