ASP.Net 中操作Ajax
有时候,越深入去了解一个点,越发觉得自己无知,而之前当自己晓得一两个片面的点还洋洋自得,殊不知,这是多么讽刺,JQuery中有很多优势,比如异步提交值,部分刷新,给用户很好的体验感。目前为止,大部分项目基本都是MVC开发,部分WebForm的项目逐渐被淘汰,恰巧当前维护是银行多年前的古董项目,WebForm已许久不接触, 趁此机会,总结下与Ajax的交互,虽然MVC与Ajax的交互更友好简洁。
下面介绍常见的JQuery中对Ajax的应用 Load()、Ajax()、Get()、Post()、getJson()、getScript()
jQery对Ajax操作进行了封装,常见的 ajax()属于最底层的方法,使用频率很高的 $.post()、$.get() 是在最底层的基础上又细分出来封装的一层,因为其分别对应的ajax()中 type的 post、get。可简单的理解为
- GET - 从指定的资源请求数据。
- POST - 向指定的资源提交要被处理的数据
前台发送数据-->后台接收-->进行处理-->返回前台-->前台将值显示在评论区
为什么说是绕了一大圈,因为GET、POST 是有区别的,我这里为了统一写DEMO,不免在用法上有画蛇添足之嫌
前台body内容总览
<body>
<form id="form1" runat="server">
<div>
姓名:<asp:TextBox ID="txtName" runat="server" ClientIDMode="Static"></asp:TextBox>
<p></p>
評論:<asp:TextBox ID="txtContent" runat="server" ClientIDMode="Static" TextMode="MultiLine"></asp:TextBox>
<p></p>
<asp:Button ID="btnAjax" runat="server" Text="Ajax" ClientIDMode="Static"></asp:Button>
<asp:Button ID="btnPost" runat="server" Text="Post" ClientIDMode="Static"></asp:Button>
<asp:Button ID="btnGet" runat="server" Text="Get" ClientIDMode="Static" />
<p></p>
</div>
<div class="comment">評論區</div>
<div id="resTest" title="content" style="height:auto"></div>
</form>
</body>
1. Ajax()
①可以直接请求到后台中某个方法,而不必在后台Load事件中处理
②可以设置失败时的函数
前台界面:(PS:form表单下的ASP中button控件,默认类型值是submit,所以在前台方法下面都增加了 return false;下同)
$("#btnAjax").click(function () {
$.ajax({
type: "post",
contentType: "application/json; charset=utf-8",
dataType: "json",
url: "WebForm1.aspx/ReceiveJson",
data: "{'Name':'郎中令','Content':'200'}",
success: function (data) {
$("#resTest").append(data.d);
},
error: function () {
alert("發送失敗");
}
});
return false;
});
后台界面:
//參數名必須與前台JSon鍵名一致
[WebMethod]
public static string ReceiveJson(string Name, string Content)
{
return Name + " " +DateTime.Now.ToString("yyyyMMdd HH:mm:ss")+ "<br /> " + "Content:" + Content;
}
2. post() 主要用来区别get()
① 方式不同, 一般表单的提交中get请求会让参数显示在url 栏中进行传递,post请求是作为http消息的实体内容发送给后台
② 大小不同, get请求是以url 传递参数的,所以会有大小限制,而post则可以传更多更大的数据
③ 安全性不同, get请求的数据会被浏览器缓存起来,可在历史记录中查看,对于密码等某些信息会不安全
前台界面:
$("#btnPost").click(function () {
if ($("#txtName").val()!=""&&$("#txtAge").val()!="") {
$.post("WebForm1.aspx", {
Name: $("#txtName").val(),
Content: $("#txtContent").val()
}, function (data) {
$("#resTest").append(data);
});
}
else {
alert("界面中尚有文本框值未填寫");
}
return false;
});
3. get() 该说的前面都说了,用法以及参数结构和post()一样,这里没什么好讲的
$("#btnGet").click(function () {
if ($("#txtName").val()!=""&&$("#txtAge").val()!="") {
$.get("WebForm1.aspx", {
Name: $("#txtName").val(),
Content: $("#txtContent").val()
}, function (data,status) {
$("#resTest").html(data);
});
}
else {
alert("界面中尚有文本框值未填寫");
}
return false;
});
对于后台而言,Post()和Get()请求,都必须在Load 事件里面处理,即使前台定义后台中的方法,像ajax()那样 ,为 url: "WebForm1.aspx/ReceiveJson", 也不能处理,这点我也暂时没有想明白,线上也暂无解决方案。此两者后台的处理方式完全一样,如下,仅仅是将接收的值中间 加了一个时间
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
if (Request["Name"] != null || Request["Content"] != null)
{
string all = Request["Name"].ToString()+" " +DateTime.Now.ToString("yyyyMMdd HH:mm:ss")+ "<br /> " + Request["Content"].ToString();
Response.Write(all);
Response.End();
}
}
}
三个方法已罗列出来,启动项目,看看效果如何

好吧,我承认,这个太丑了,功能还是实现了的
权当是个学习记录
----市人皆大笑,举手揶揄之
ASP.Net 中操作Ajax的更多相关文章
- 【译】在Asp.Net中操作PDF - iTextSharp - 利用列进行排版
原文 [译]在Asp.Net中操作PDF - iTextSharp - 利用列进行排版 在使用iTextSharp通过ASP.Net生成PDF的系列文章中,前面的文章已经讲述了iTextSharp所涵 ...
- 【译】在Asp.Net中操作PDF - iTextSharp - 绘制矢量图
原文 [译]在Asp.Net中操作PDF - iTextSharp - 绘制矢量图 在上一篇iTextSharp文章中讲述了如何将现有的图片插入PDF中并对其进行操作.但有时,你需要在PDF中绘制不依 ...
- 【译】在Asp.Net中操作PDF – iTextSharp - 操作图片
原文 [译]在Asp.Net中操作PDF – iTextSharp - 操作图片 作为我的iTextSharp系列的文章的第七篇,开始探索使用iTextSharp在PDF中操作图片,理解本篇文章需要看 ...
- 【译】在Asp.Net中操作PDF – iTextSharp - 使用表格
原文 [译]在Asp.Net中操作PDF – iTextSharp - 使用表格 使用Asp.Net生成PDF最常用的元素应该是表格,表格可以帮助比如订单或者发票类型的文档更加格式化和美观.本篇文章并 ...
- 【译】在Asp.Net中操作PDF – iTextSharp - 使用链接和书签
原文 [译]在Asp.Net中操作PDF – iTextSharp - 使用链接和书签 用户和PDF文档的交互可以通过锚(链接)和书签进行,接着我前面iTextSharp的系列文章,本篇文章主要讲通过 ...
- 【译】在Asp.Net中操作PDF – iTextSharp-列表
原文 [译]在Asp.Net中操作PDF – iTextSharp-列表 在前文中,我们已经知道了如何利用iTextSharp创建PDF文档,设置字体样式和风格.本文开始讲述iTextSharp中的有 ...
- 【译】在Asp.Net中操作PDF – iTextSharp -利用块,短语,段落添加文本
原文 [译]在Asp.Net中操作PDF – iTextSharp -利用块,短语,段落添加文本 本篇文章是讲述使用iTextSharp这个开源组件的系列文章的第三篇,iTextSharp可以通过As ...
- 【译】在Asp.Net中操作PDF - iTextSharp - 使用字体
原文 [译]在Asp.Net中操作PDF - iTextSharp - 使用字体 紧接着前面我对iTextSharp简介博文,iTextSharp是一个免费的允许Asp.Net对PDF进行操作的第三方 ...
- 【转】使用iTextSharp在Asp.Net中操作PDF
使用iTextSharp在Asp.Net中操作PDF操作 使用iTextSharp在Asp.Net中操作PDF系列文章目录 实战 iTextSharp iTextSharp 合并多个PDF文件 C#生 ...
随机推荐
- Nand Flash 裸机程序
硬件平台 :JZ2440 实现功能:初始化 Nand Flash 和 sdram,并将代码从 Nand Flash 拷贝到 sdram. start.s --> 上电初始化 nand ...
- Log4j Append属性指定是否追加内容
Log4j默认是不断的把日志内容追加到日志文件: 这里就有个属性 Append 默认就是true: 假如我们设置成false 就不追加了 直接覆盖前面的内容: 我们来测试下: log4j.rootLo ...
- (1.7)mysql profiles分析
mysql profiles分析 作用:记录会话查询SQL所用时间 1.开启 2.使用 [2.1]先使用一个查询 [2.2]然后再运行 show profiles; [2.3]查看执行过程中每个状态和 ...
- 转场动画UINavigationControllerDelegate
从iOS7开始,苹果更新了自定义ViewController转场的API,这些新增的类和接口让很多人困惑,望而却步.本文就从这些API入口,让读者理清这些API错综复杂的关系. 几个protocol ...
- IPFS私链搭建及常用操作命令
1. 共享密钥 同一个IPFS私链内的所有节点必须共享同一个密钥才能加入. 首先我们使用密钥创建工具,创建一个密钥. 下载地址:https://github.com/Kubuxu/go-ipfs-sw ...
- 2018-2019-1 20189221《Linux内核原理与分析》第二周作业
读书报告 <庖丁解牛Linux内核分析> 第 1 章 计算工作原理 1.1 存储程序计算机工作模型 1.2 x86-32汇编基础 1.3汇编一个简单的C语言程序并分析其汇编指令执行过程 因 ...
- 16个PHP设计模式详解
说明:该教程全部截选自实验楼教程[16个PHP设计模式详解]:主要介绍16个常用的设计模式的基础概念和技术要点,通过UML类图帮助理解设计模式中各个类之间的关联关系,针对每种设计模式都使用PHP完成了 ...
- iOS UI布局-定时器
定时器是比较常用的一个UI控件,在付款.抢购时,经常会使用到.提取成一个通用的方法 /** * 倒计时GCD通用方法 * 通常用的计时器都是用NSTimer,但是NSTimer在线程很吃紧的时候效果不 ...
- iOS 第三方框架-MJExtension
1.数组转换成模型数组 // 将 "微博字典"数组 转为 "微博模型"数组 NSArray *newStatuses = [HWStatus objectArr ...
- theos第一次编译成功,记录一下
theos 是github 90444af分支上的,下载设置环境变量 vi /etc/profile. 将/opt/theos/bin加入环境变量 运行nic.pl f 输入11生成工程,一路跳过 最 ...