iou3344 2023-01-27 00:10 采纳率: 89.6%
浏览 22
已结题

似乎是ajax+php分页的初级问题

第一次做ajax,有一些基础问题不太明白。
1、我用search.php做好分页并带着分页导航返回ajax.php页面后,一点链接就跳转到search.php页去了,这就没有ajax的效果了啊。
2、分页应该是search页面做好给ajax页面,还是在ajax页面做分页呢?
3、如果在ajax页面做分页,那就就没办法知道一共多少页,最多就只能加个上一页、下一页按钮,这个用户体验也太差了吧?而search传过来的分页却可以包含很多信息,而且操作也很简单。First Previous 1 2 3 4 5 6 7 8 Next Last Total: 100
所以,这个问题的通行做法是什么呢?

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<title>jajx</title>
<a name="aaa">点我就可以通过ajax访问ajaxsearch.php页面的返回数据</a>
<div class="container">
</div>
<script>
$(document).ready(function(){
    $("a[name='aaa']").click(function(){
        ajaxRequest('aaa');
    });
    $("a[name='noaaa']").click(function(){
        ajaxRequest('noaaa');
    });
    $("a[name='bbb']").click(function(){
        ajaxRequest('bbb');
    });
});
 
function ajaxRequest(param) {
    console.log(param);
    $.ajax({
        type: "GET",
        url: "ajaxsearch.php",
        data: {param: param},
        success: function(data){
            $(".container").html(data);
        }
    });
}
 
$(document).on('click', '.pagination a', function(event){
    event.preventDefault();
    event.stopPropagation();
    var href = $(this).attr('href');
    var param = href.split("param=")[1].split("&")[0];
    var page = href.split("page=")[1];
    $.ajax({
        url: "ajaxsearch.php",
        type: "GET",
        data: { limit: page,param:param },
        success: function(data) {
            $(".container").html(data);
        }
    });
    return false;
});
</script>

现状如下:
1、已经可以读取ajaxsearch.php页面的时间,进container的div
2、分页数据也是来自于ajaxsearch.php,也可以带进container的div
3、读过来的分页导航是在一个pagination的div里面,详细代码见下面。
4、问题就是,只要点页码,就会跳转到ajaxsearch.php,怎么改都不行。

<div id="pagination">
<a href="ajaxsearch.php?param=aaa&amp;page=1">First</a>
<span class="activea">1</span>
<a href="ajaxsearch.php?param=aaa&amp;page=2">2</a>
<a href="ajaxsearch.php?param=aaa&amp;page=3">3</a>
<a href="ajaxsearch.php?param=aaa&amp;page=4">4</a>
<a href="ajaxsearch.php?param=aaa&amp;page=5">5</a>
<a href="ajaxsearch.php?param=aaa&amp;page=2">Next</a>
<a href="ajaxsearch.php?param=aaa&amp;page=264">Last</a>
<span class="total">Total: 1317</span>
</div>

另外,分页是ajax页面显示,点击时如果实现了不跳转,是不是还需要通过ajax页面向php页面传递页码等参数啊?不然咋调下一页的数据呢?感觉好复杂啊。

  • 写回答

3条回答 默认 最新

      报告相同问题?

      相关推荐 更多相似问题

      问题事件

      • 系统已结题 2月4日
      • 已采纳回答 1月27日
      • 修改了问题 1月27日
      • 创建了问题 1月27日

      悬赏问题

      • ¥200 把公众号页面和文章,嵌入到其他平台!就像搬家一样!
      • ¥20 matlab编程问题。详情如下,利用chatgpt写的代码总是达不到要求。
      • ¥15 matlab画三维流场
      • ¥100 IIC通讯数据算法分析
      • ¥15 matlab 绘制涡流场
      • ¥15 依存句法分析如何与BERT模型及GCN相结合
      • ¥66 有偿收一个会Python 与unitysocket通信,会简单mediapipe手势识别的哥
      • ¥15 药店卖药设计使利润最大
      • ¥15 模拟银行实现VIP服务
      • ¥20 ECU在实车上can通讯失败或不稳定