首页 > 其他分享 >页面ajax刷新的一种方式

页面ajax刷新的一种方式

时间:2023-08-29 18:35:45浏览次数:39  
标签:load 翻页 标签 list 列表 ajax 刷新 页面


        在做页面异步刷新时,以前的做法是,通过$.ajax()请求返回json格式的数据,然后通过回调方法,将数据一一解析出来,放到标签元素中,再与原页面衔接起来。这里有另一种做法:

如:一个页面中有两个TAB,每个TAB都对应有一个具有翻页功能的list。这时如果页面上还有其他的元素,那么通过$(document).ready()方法,来异步加载tab列表:

 

$(document).ready(function() {
      $("#tb1").load("getList.do?type=1);
}

 

    在getList.do方法中,返回一个列表的中间页面:

   

pulbic String doGetList(Model model) {
        model.put("list",list);
        return "page/listPage";
}

 

    然后在中间页面listPage.jsp中,用foreach标签迭代出列表,然后翻页的功能由标签<page:page>完成:

   

<page:page url="getList.do?handType=type&" pageSize="${pageSize}" pageIndex="${pageIndex}" pageMax="${totalPage}" partMark="true" callBack="doPageAction"></page:page>

/**
 * 翻页回调方法
 */
function doPageAction(url){
       var pageActionUrl = url+"&op_user_id="+op_user_id;
       $("#tb_have").load(pageActionUrl);
}

 

   

  

   

标签:load,翻页,标签,list,列表,ajax,刷新,页面
From: https://blog.51cto.com/u_16240770/7279007

相关文章

  • 聊聊spring项目中如何动态刷新bean
    前言前阵子和朋友聊天,他手头上有个spring单体项目,每次数据库配置变更,他都要重启项目,让配置生效。他就想说有没有什么办法,不重启项目,又可以让配置生效。当时我就跟他说,可以用配置中心,他的意思是因为是维护类项目,不想再额外引入一个配置中心,增加运维成本。后边跟他讨论了一个方案,可......
  • bootstrap页面集成jquery异步请求
    jquery技术是对原生js技术的封装和优化,实现页面上的功能能独立的运行和提交给后台程序,相比之前的用表单整体提交数据可以提高系统的性能,加快响应速度。要在项目中使用jquery必须先引入相关的js脚本,在项目中导入这些js脚本文件:导入后接下来再进行相关技术的操作。实现效果,在一个页面......
  • 05 Ajax请求(扩展,延伸)
    05Ajax请求(扩展,延伸)首先,我们用Flask创建一个后台服务器(自己做网站了哈)目录结构:服务端:fromflaskimportFlask,render_template,request#pipinstallFlaskapp=Flask(__name__)@app.route("/")defindex():#跳转到首页print("你曾经来过服务器"......
  • 在低代码平台执行 API 请求并将结果显示在页面上
    低代码开发平台(Low-CodeDevelopmentPlatform)是一种用于构建应用程序的软件开发环境,它允许开发者通过图形化的方式,而非传统的手动编码方式来创建应用程序。这种方式大大减少了开发应用程序所需的代码量,因此称为低代码。低代码平台的核心是其拖放式的用户界面,这允许开发者通过直......
  • 基于JS实现回到页面顶部的五种写法(从实现到增强)
    这篇文章主要介绍了基于JS实现回到页面顶部的五种写法(从实现到增强)的相关资料,本文介绍的非常详细,实用性也非常高,非常具有参考借鉴价值,需要的朋友可以参考下 写法【1】锚点使用锚点链接是一种简单的返回顶部的功能实现。该实现主要在页面顶部放置一个指定名称的锚......
  • 使用postMessage实现iframe和父页面通信
    语法语法otherWindow.postMessage(message,targetOrigin,[transfer]);otherWindow其他窗口的一个引用,例如向子窗口发送则otherWindow是子窗口的window对象父页面向子页面Iframe通信//父页面//获取iframe元素constiFrame:SafeAny=document.getElementById......
  • RabbitMQ 管理页面该如何查看有哪些连接
    用浏览器访问  http://192.168.1.100:15672   默认用户名:admin   密码: admin 登陆后显示 在Connections页中查看所有连接    ......
  • vue3同一页面内重复引用同一操作dom的组件产生的问题
    [2023年8月28日12:39:40]vue3同一页面内标签<component>重复引用同一组件,且该组件内使用css选择器进行dom操作导致页面内相同组件发生变化的问题解决记录组件内进行dom操作,需要通过js方法进行选择器的元素获取,但当vue3全部渲染完毕后,页面内有多个id为test9的相同元素,元素选择将......
  • DWR的注释(annotations)使用及反向调用(Reverse Ajax)
    先说说注释语法,省掉dwr.xml。(自从用了java5之后,现在越看一堆堆的配置文件越烦,越来越喜欢注释方式来的直接简单了)  首先下载最新的稳定版本的dwr.jar文件放到你的工程中。(还有需要其它的吗?不需要了,dwr就是这么简单)然后在web.xml中添加如下一段<!--DWRServlet--><servle......
  • Ajax
    AJAX第一章:ajax介绍1、AJAX全称为AsynchronousJavaScriptAndXML,就是异步的JS和XML。2、作用:通过AJAX可以在浏览器中向服务器发送异步请求,最大的优势:无刷新获取数据。XML介绍XML可扩展标记语言。XML被设计用来传输和存储数据。XML和HTML类似,不同的是......