web开发中我们经常会遇到局部刷新页面的需求,以前我经常使用ajax和iframe实现局部刷新,后来做政府的项目,对页面的样式要求比较多,发现使用iframe控制样式什么的很麻烦,所以就采用了新的办法,就是下面我们要说的ajax配合div局部刷新页面,其实很简单,下面我们就看一下这种刷新方式是如何实现的。

jsp页面ajax代码如下:

$("#waitWork").click(function(){
var url = "请求地址";
var data = {type:1};
$.ajax({
type : "get",
async : false, //同步请求
url : url,
data : data,
timeout:1000,
success:function(dates){
//alert(dates);
$("#mainContent").html(dates);//要刷新的div
},
error: function() {
// alert("失败,请稍后再试!");
}
});
});
<div id="mainContent">

注意:后台需要针对div里的信息单独用一个jsp页面,不然就需要自己封装好需要的页面信息返回
这个方法可以实现单独刷新一个div,好用的一点就是:如果将div里需要的信息单独放到一个jsp页面里,都不需要我们后台拼装数据了,非常方便。

(局部刷新)jquery.ajax提交并实现单个div刷新的更多相关文章

  1. jquery ajax提交表单数据的两种方式

    http://www.kwstu.com/ArticleView/kwstu_201331316441313 貌似AJAX越来越火了,作为一个WEB程序开发者要是不会这个感觉就要落伍,甚至有可能在求职 ...

  2. 继上篇-jquery ajax提交 本篇用ajax提交的数据去数据库查询

    上篇讲到如何用jquery ajax提交数据至后台,后台接收并返回给ajax.https://www.cnblogs.com/tiezhuxiong/p/11943328.html 今天我们把数据传到 ...

  3. jquery ajax提交数据给后端

    大家好,今天铁柱兄给大家带一段jquery ajax提交数据给后端的教学. 初学javaweb的同学前端提交数据基本上都是用form表单提交,这玩意儿反正我是觉得不太好玩.而JavaScript aj ...

  4. JQuery ajax提交表单及表单验证

    JQuery ajax提交表单及表单验证 博客分类: jsp/html/javascript/ajax/development Kit 开源项目   注:经过验证,formValidator只适合一个 ...

  5. Checkbox框全选操作,form表单提交与jquery ajax提交两种处理方式

    //1.jquery ajax<script type="text/javascript"> $(function(){ var basePath = $(" ...

  6. form表单提交数据,页面必定会刷新,ajax提交数据不会刷新,做到悄悄提交,多选删除,ajax提交实例

    很多页面用到的模态对话框,如知明网站https://dig.chouti.com/的登录页都是模态对话框, 当点登录时,是用的ajax提交,因为输入错了信息,有返回消息,而页面没有刷新. jquery ...

  7. Jquery Ajax 提交json数据

    在MVC控制器(这里是TestController)下有一个CreateOrder的Action方法 [HttpPost] public ActionResult CreateOrder(List&l ...

  8. Jquery ajax提交表单几种方法

    在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...

  9. 诅咒JavaScript之:Jquery ajax提交内容异常

    jquery ajax 通过url提交内容,在服务器端获取却出现很奇怪的值,代码如下: ajaxurl = "aspx/logTable.ashx?action=load&Every ...

随机推荐

  1. CentOS yum 安装node.js

    第一步: curl --silent --location https://rpm.nodesource.com/setup_10.x | sudo bash - 第二步: sudo yum -y i ...

  2. centos6.8安装Discuz!X3.1(PHP论坛)

    1.首先搭建apache+mysql+php环境: 一.安装 MySQL 首先来进行 MySQL 的安装.打开超级终端,输入: [root@localhost ~]# yum install mysq ...

  3. appium ios 自动化测试

    iOS自动化测试:Appium 从入门到实践https://www.jianshu.com/p/43f858180557appium自动化测试iOS Demohttps://www.jianshu.c ...

  4. 编辑器——sublime

    在这里只介绍自己经常使用的编辑器sublime 第一:安装node插件[出处:http://www.bubuko.com/infodetail-798008.html] 1.下载Nodejs插件,下载 ...

  5. thunk函数

    1.函数参数求值的策略 a.传值策略(c语言) 传值策略就是在进入函数体之前将 参数计算之后 将参数的值传入到函数体之中. let x = 8 f(x + 1)//参数为 f(9)//传进去的值实际上 ...

  6. Using RUNDLL32.exe to call a function within a dll

    Using RUNDLL32.exe to call a function within a dll        Rundll32 is a utility included with Window ...

  7. viewFlipper 之二

    main.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xml ...

  8. Delphi APP 開發入門(八)SQLite資料庫

    Delphi APP 開發入門(八)SQLite資料庫 分享: Share on facebookShare on twitterShare on google_plusone_share   閲讀次 ...

  9. 什么是“HTML”?HTML的“标记”是什么?

    ①文本标记语言 即HTML(Hypertext Markup Language),是用于描述网页文档的一种标记语言. ②HTML 标记标签 通常被称为 HTML 标签 (HTML tag). ③HTM ...

  10. react-native 解决Could not find method android() for arguments问题

    运行命令行:react-native run-android 报错 Error:(23, 0) Could not find method android() for arguments [****] ...