1. 最原始的ajax请求方式

(1). get请求

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxDemo.aspx.cs" Inherits="ajax_AjaxDemo" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="../js/jquery-1.7.1.js"></script>
<script type="text/javascript">
$(function () {
$("#btnGetDate").click(function () {
//开始通过AJAX向服务器发送请求.
var xhr;
if (XMLHttpRequest) {//表示用户使用的高版本IE,谷歌,狐火等浏览器
xhr = new XMLHttpRequest();
} else {// 低IE
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open("get", "GetDate.ashx?name=zhangsan&age=12", true);
xhr.send();//开始发送
//回调函数:当服务器将数据返回给浏览器后,自动调用该方法。
xhr.onreadystatechange = function () {
if (xhr.readyState == ) {//表示服务端已经将数据完整返回,并且浏览器全部接受完毕。
if (xhr.status == ) {//判断响应状态码是否为200. alert(xhr.responseText); }
}
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="button" value="获取服务端时间" id="btnGetDate" />
</div>
</form>
</body>
</html>

(2). post请求

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxPostDemo.aspx.cs" Inherits="ajax_AjaxPostDemo" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="../js/jquery-1.7.1.js"></script>
<script type="text/javascript">
$(function () {
$("#btnPost").click(function () {
var xhr;
if (XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open("post", "GetDate.ashx", true);
// 表示想服务端发送的请求都放在请求报文体中,并且以下面的形式发送出去
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("name=zhangsan&pwd=123");
xhr.onreadystatechange = function () {
if (xhr.readyState == ) {
if (xhr.status == ) {
alert(xhr.responseText);
}
}
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server" >
<div>
<input type="button" value="获取数据" id="btnPost" /> </div>
</form>
</body>
</html>

(3). 请求的公共ashx文件

<%@ WebHandler Language="C#" Class="GetDate" %>

using System;
using System.Web;
public class GetDate : IHttpHandler
{ public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
// context.requrest该方法会自动判断请求的方式是get还是post
context.Response.Write(context.Request["name"]);
} public bool IsReusable
{
get
{
return false;
}
}
}

(4) .通过Jquery请求Ajax的方式

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="JqueryAjax.aspx.cs" Inherits="ajax_JqueryAjax" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="../js/jquery-1.7.1.js"></script>
<script type="text/javascript">
$(function () {
$("#btnGet").click(function () { //回调函数
$.get("GetDate.ashx", { "name": "lisi", "pwd": "" }, function (data) {
alert(data)
}); }); $("#btnPost").click(function () {
$.post("GetDate.ashx", { "name": "lisi", "pwd": "" }, function (data) {
alert(data)
})
}); $("#btnAjax").click(function () {
$.ajax({
type: "POST", //请求类型
url: "GetDate.ashx", //请求地址
data: "name=John&location=Boston", //请求参数
success: function (msg) { //回调函数
alert("Data Saved: " + msg);
}
}); }); });
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="button" value="GET获取数据" id="btnGet" />
<input type="button" value="POST获取数据" id="btnPost" />
<input type="button" value="AJAX获取数据" id="btnAjax" />
</div>
</form>
</body>
</html>

(5). serializeArray方法的使用

//将对象转成json对象传递给后端
$("button").click(function(){
var par =$("form表单id的值").serializeArray();
});

Ajax_请求get,post案例的更多相关文章

  1. Ajax与ashx异步请求的简单案例

    Ajax与ashx异步请求的简单案例: 前台页面(aspx): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//E ...

  2. postman发送json请求,使用案例

    介绍:  postman是一个很好的http模拟器,,可以发送get.post.put等各种请求,是测试服务接口相当好的工具. postman发送json请求,使用案例 发送json的具体步骤: 1. ...

  3. asp.net——Ajax与ashx异步请求的简单案例

    Ajax与ashx异步请求的简单案例: 前台页面(aspx): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//E ...

  4. Spring框架系列(5) - 深入浅出SpringMVC请求流程和案例

    前文我们介绍了Spring框架和Spring框架中最为重要的两个技术点(IOC和AOP),那我们如何更好的构建上层的应用呢(比如web 应用),这便是SpringMVC:Spring MVC是Spri ...

  5. ajax请求json数据案例

    今天有这样一个需求,点击六个大洲,出现对应的一些请求信息,展示在下面,请求请求过后,第二次点击就无需请求.如图所示:点击北美洲下面出现请求的一些数据 html代码结构: <div class=& ...

  6. Flask web开发 处理POST请求(登录案例)

    本文我们以一个登录例子来说明Flask对 post请求的处理机制. 1.创建应用目录,如 mkdir   example cd example 2.在应用目录下创建  run.py文件,内容如下 fr ...

  7. jQuery实例之ajax请求json数据案例

    今天有这样一个需求,点击六个大洲,出现对应的一些请求信息,展示在下面,请求请求过后,第二次点击就无需请求.如图所示:点击北美洲下面出现请求的一些数据 html代码结构: <div class=& ...

  8. 接口测试中三种传参请求(Map、request、Integer)解析

    注册企业接口传入的是一个request,查询企业接口传入的是一个integer:根据名称和国家名称模糊匹配接口传入的是一个Map:针对三种不同的传参我怎么作接口测试呢? 1 package com.w ...

  9. 第4章 TCP/IP通信案例:访问Internet上的Web服务器

    第4章 TCP/IP通信案例:访问Internet上的Web服务器 4.2 部署代理服务器 书中为了演示访问Internet上的Web服务器的全过程,使用了squid代理服务器程序模拟了一个代理服务器 ...

随机推荐

  1. iOS项目之“返回”手势操作相关

    在程序中,总会设置“返回”按钮,但不可能在每一个控制器中都去设置一次“返回”按钮,那如何设置全局的“返回”按钮呢? 首先自定义一个导航控制器,在tabBarController中添加子控制器时,使用这 ...

  2. mysql备份与恢复-xtracebackup

    因为percona打算放弃使用innobackupex备份工具,因此我们这里也说明一下innobackupex的兄弟工具xtraceback工具的使用 这个工具的安装可以参考上面的一些博文,上面详细说 ...

  3. powermockito 常用操作

    1:Mock带参数的静态方法 PowerMockito类 package org.powermock.api.mockito; CityCodeBean cityCodeBean = CityCode ...

  4. php5.3.x连接MS SQL server2008

    开篇 因为毕设老师需求的原因,虚拟旅游网站要求的数据库必须使用MS SQL server. 我最擅长的web编程语言是PHP,但是在PHP中链接MS SQL server是一件非常麻烦的事,我个人分析 ...

  5. eclipse在注释时候字体变成繁体字

    输入法和java中的快捷键冲突了,按下ctrl+shift+F就切换回去了

  6. Vue父子组件生命周期

    转载自:https://blog.csdn.net/a8725585/article/details/79092505 vue父子组件钩子函数触发顺序 beforeMount后mounted前构造子组 ...

  7. eval()、exec()与execfile()

    eval(expression[, globals[, locals]]) eval()函数执行一个python表达式字符串并返回表达式执行后的结果: >>> x = 1 >& ...

  8. 2018年11月22日 字典 E18灯翼平整度 D&G is SB

    如果创建的东西需要增加修改的,则用list 如果不能修改就用元祖,如果需要修改这需要转成list 字典 字典的value是任意值 info= {"k1":'v1',"k2 ...

  9. vsCode设置中文

    1.安装软件之后,关闭欢迎界面,Ctrl+shift+p打开命令窗口,输入lang,选择configuration display language,改为 "locale":&qu ...

  10. RPMB分区介绍【转】

    本文转载自:https://blog.csdn.net/xiezhi123456/article/details/81479793 RPMB(Replay Protected Memory Block ...