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. Linux上安装pip以及setuptools

    毕竟丰富的第三方库是python的优势所在,为了更加方便的安装第三方库,使用pip命令,我们需要进行相应的安装. 1.安装pip前需要前置安装setuptools 命令如下: wget --no-ch ...

  2. Python面试应急5分钟!

    ​ 不论你是初入江湖,还是江湖老手,只要你想给自己一个定位那就少不了面试!面试的重要性相信大家都知道把,这就是我们常说的“第一印象”,给大家说一下我的面试心得把,面试前的紧张是要的,因为这能让你充分准 ...

  3. Spring-ApplicationContext容器

    Spring ApplicationContext容器 ApplicationContext是spring中比较高级的容器.和BeanFactory类似,它可以加载配置文件中定义的bean,并将所有b ...

  4. python学习笔记(十九)发送邮件

    在python开发项目或者做自动化测试时候,在测试完成后需要将测试结果总结后进行上报,那么我们就可以通过发送邮件来完成这项工作. 下面我们来看看python中怎么发送邮件的,python中发送邮件可以 ...

  5. Hbase架构和读写流程

    转载自:http://www.cnblogs.com/muzili-ykt/p/muzili_ykt.html 在HBase读写时,相同Cell(RowKey/ColumnFamily/Column相 ...

  6. linux根文件系统 /etc/resolv.conf 文件详解(转)

    大家好,今天51开源给大家介绍一个在配置文件,那就是/etc/resolv.conf.很多网友对此文件的用处不太了解.其实并不复杂,它是DNS客户机配置文件,用于设置DNS服务器的IP地址及DNS域名 ...

  7. 47. Permutations II (全排列有重复的元素)

    Given a collection of numbers that might contain duplicates, return all possible unique permutations ...

  8. JVM 内存知识总结

    本文主要参考内容: http://hllvm.group.iteye.com/group/wiki/3053-JVM http://my.oschina.net/xishuixixia/blog/13 ...

  9. Django学习笔记之Django ORM Aggregation聚合详解

    在当今根据需求而不断调整而成的应用程序中,通常不仅需要能依常规的字段,如字母顺序或创建日期,来对项目进行排序,还需要按其他某种动态数据对项目进行排序.Djngo聚合就能满足这些要求. 以下面的Mode ...

  10. CSS Float(浮动)

    CSS Float(浮动) 一.CSS Float(浮动) CSS 的 Float(浮动),会使元素向左或向右移动,其周围的元素也会重新排列. Float(浮动),往往是用于图像,但它在布局时一样非常 ...