ASP.NET MVC如何在页面加载完成后ajax异步刷新
背景:之前已写过两篇有关Ajax的随笔,这一篇是单独针对在页面加载完成的Ajax操作。比如说打开学生列表页面,先加载页面,然后以Ajax的方式,从数据库中检索相应的学生信息,给浏览者更好的体验。
简单版本:document加载完成之后,调用ajax刷新当前页面,修改pLoad的显示文本。
前台代码如下:
<body>
<div>
<p id="pLoad">Ajax之前的结果</p>
</div>
</body>
</html>
<script>
$(function () {
$.ajax({
type: "POST",
url: "/PageLoad/Test?City=北京&Name=SharpL&Age=18",
cache: false,
data: null,
success: function (result) {
if (result) {
$("#pLoad").text("ajax之后的结果为 " + result.Message + "\n");
}
}
})
});
</script>
如代码所示,在加载完成之后,ajax调用PageLoad控制器下的Test动作方法,后台代码如下:
public ActionResult Test()
{
var actionResult = default(JsonResult);
var stu = new STU();
this.UpdateModel(stu);
var tmp = string.Format("{0}{1}岁,来自{2}", stu.Name, stu.Age, stu.City);
actionResult = new JsonResult()
{
Data = new { Message = tmp }
};
Thread.Sleep();
return actionResult;
}
根据前台传递过来的学生信息,返回一个字符串给ajax,注意Thread.Sleep(5000),使当前的进程休息5秒,使ajax的效果更加明显,效果图如下:
刚刚加载完Document之后:

5秒钟之后:

补充:以$.post()的方式发起Ajax请求,参考链接:AJAX请求 $.post方法的使用
等价的AJax代码1:
$.post("/TestAjax/Test", { City: '北京', Name: 'Sharp', Age: }, function (result) {
if (result) {
$("#pDisplay").text("返回信息为 " + result.Message + "\n" + "随机数为" + result.RandomNum);
}
});
等价的Ajax代码2:
$.post("/TestAjax/Test?City=北京&Name=SharpL&Age=45", "", function (result) {
if (result) {
$("#pDisplay").text("返回信息为 " + result.Message + "\n" + "随机数为" + result.RandomNum);
}
});
ASP.NET MVC如何在页面加载完成后ajax异步刷新的更多相关文章
- layui 页面加载完成后ajax重新为 html 赋值 遇到的坑
页面加载完毕后,通过 ajax 按照返回值,为部分 html 赋值: $(function(){ ..... }) 直接这样写,报错,$ 没有定义什么的,错位原因为 jquery 引入错误. layu ...
- 【ASP.NET MVC】提高页面加载速度:脚本优化
在这里我们说一下脚本优化的三个方法: 一.在我们做Web开发的时候,当我们引用Js文件的时候,我们一般会将js文件放在文档的head标签中,这时当页面加载的时候,浏览器会按着由上到下的顺序,当浏览器遇 ...
- 页面加载完成后,触发事件——trigger()
<button id="btn">点击我</button> <div id="test"></div> 如果页面 ...
- Javascript中页面加载完成后优先执行顺序
Javascript中页面加载完成后优先执行顺序 document优先于windowwindow优先于element //document加载完成执行方法体 document.addEventList ...
- js页面加载完后执行(document.onreadystatechange 和 document.readyState)
js页面加载完后执行javascript(document.onreadystatechange 和 document.readyState) document.onreadystatechange ...
- js中页面加载完成后执行的几种方式及执行顺序
1:使用jQuery的$(function){}; 2:使用jquery的$(document).ready(function(){});前两者本质上没有区别,第1种是第2种的简写方式.两个是docu ...
- jquery在页面加载完成后再append的元素事件无效问题
最近遇到一个问题,jquery在页面加载完成后再append的元素,append元素上有onclick事件,但是在append的元素上怎么点击都不会触发onclick事件.就如: <ul cla ...
- 页面加载完毕后调用js方法进行布局操控 已实验
页面加载完毕后调用js方法进行布局操控 已实验 $(function(){ var check1 = $("[id$=SMS]").is(':checked'); var bl=$ ...
- php页面加载完毕后再显示购买按钮
php页面加载完毕后再显示购买按钮 $document.ready(function(){ $("#buybotton").show()})
随机推荐
- 跟我一起玩Win32开发(2):完整的开发流程
上一篇中我给各位说了一般人认为C++中较为难的东西——指针.其实对于C++,难点当然不局限在指针这玩意儿上,还有一些有趣的概念,如模板类.虚基类.纯虚函数等,这些都是概念性的东西,几乎每一本C++书上 ...
- Codeforces 1144F(二分染色)
发现奇环不可行,偶环可行,考虑二分图.然后染色,方向全都从一种指向另一种就可以了,随意. ; int n, m, color[maxn]; vector<int> vc[maxn]; ve ...
- HDU6438(贪心技巧)
第一眼喜闻乐见的股票问题dp可以暴力,然鹅时间不允许. 于是考虑怎么贪. 这篇题解说得很生动了. 因为每支股票都有买入的潜力所以肯定都加在优先队列里. 然后考虑的是哪些需要加入两次.这是我第二次见到类 ...
- 牛客网NOIP赛前集训营-普及组
第一场: A-绩点 题目描述 小A刚考完大学考试.现在已经出了n门课的成绩,他想自己先算一下这些课的绩点是多少.设第i门课的他拿到的绩点是gpai,而这门课的学分是sci,那么他的总绩点用下面的公式计 ...
- C# HashSet 用法[转]
原文链接 .NET 3.5在System.Collections.Generic命名空间中包含一个新的集合类:HashSet<T>.这个集合类包含不重复项的无序列表.这种集合称为“集(se ...
- h5-20-文件操作-拖放文件
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- UIBarButtonItem系统默认风格形状
typedef NS_ENUM(NSInteger, UIBarButtonSystemItem) { UIBarButtonSystemItemDone, UIBarButtonSystemItem ...
- poj2455Secret Milking Machine(二分+最大流)
链接 二分距离,小于当前距离的边容量+1,使最后流>=t 注意 会有重边 #include <iostream> #include<cstdio> #include< ...
- 导Excel数据表
需要把EXcel转换格式:
- [ AHOI 2013 ] 作业 & [ BZOJ 3809 ] Gty的二逼妹子序列
\(\\\) Description 给出一个长为 \(n\) 的数列 \(A\) 和 \(k\),多次询问: 对于一个区间 \([L_i,R_i]\),问区间内有多少个数在 \([a_i,b_i]\ ...