Question

运行此代码时，我遇到显示兼容性问题..

<div id="content">
<?php

    //The Query

    $new_query = new WP_Query();
    $new_query->query('showposts=1'.'&paged='.$paged);

    //The Loop

    while ($new_query->have_posts()) : $new_query->the_post();
?>

<a class="tajuk" href="<?php the_permalink() ?>" title="<?php echo get_the_title(); ?>">
    <?php echo get_the_title(); ?>
</a>

<?php
    endwhile;
    wp_reset_postdata();
?>
</div>

<div id="pagination">
  <?php next_posts_link('&laquo; Older Entries', $new_query->max_num_pages) ?>
  <?php previous_posts_link('Newer Entries &raquo;') ?>
</div>

<script>
jQuery(function($) {
    $('#content').on('click', '#pagination a', function(e){
        e.preventDefault();
        var link = $(this).attr('href');
        $('#content').fadeOut(500, function(){
            $(this).load(link + ' #content', function() {
                $(this).fadeIn(500);
            });
        });
    });
});
</script>

现在一切正常..但我需要将div id =“ content ”更改为另一个ID由于某种原因..在我将div标记更改为示例div id =“ testcode “javascript标签中的$（'＃测试代码'）也一样，ajax分页毕竟不起作用..有人可以帮助我吗？

Answer 1

你也需要更新JavaScript，你说你做了，但你是否在所有这三个地方都做了？

此外，您的事件监听器正在寻找 #pagination a内的#content ，如果您的标记不是这样的话。为了便于本示例，我将容器设置为document。

您的JavaScript应如下所示：

<script> jQuery(function($) { $(document).on('click', '#pagination a', function(e){ e.preventDefault(); var link = $(this).attr('href'); $('#testcode').fadeOut(500, function(){ $(this).load(link + ' #testcode', function() { $(this).fadeIn(500); }); }); }); }); </script>

如果这不起作用，您需要执行一些常见的调试技术，例如：

检查JavaScript控制台是否有错误

请确保您没有两次相同的ID

检查AJAX通话是否正在进行，这有助于确定问题所在，您可以在Chrome或Firefox中的开发者工具的网络标签中执行此操作

在代码的关键位置添加console.log次调用，以查看触发的内容和不触发的内容。这将有助于确定问题区域

wordpress jQuery与div标签id分页

1 个答案: