AJAX 即“ Asynchronous Javascript And XML ”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。
AJAX = 异步 JavaScript和XML(标准通用标记语言的子集)。
AJAX 是一种用于创建快速动态网页的技术
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新
传统的网页(不使用 AJAX)如果需要更新内容,必须重载整个网页页面。
这个术语源自描述从基于 Web 的应用到基于数据的应用的转换。在基于数据的应用中,用户需求的数据如联系人列表,可以从独立于实际网页的服务端取得并且可以被动态地写入网页中,给缓慢的Web应用体验着色使之像桌面应用一样。
AJAX 的核心是 JavaScript 对象 XMLHttpRequest。该对象在 Internet Explorer 5 中首次引入,它是一种支持异步请求的技术。简而言之,XMLHttpRequest使您可以使用 JavaScript 向服务器提出请求并处理响应,而不阻塞用户
 
 
先引用jQuery,再写代码
代码格式:(李献策lxc)
$.ajax({
url:"",//要将此次请求发送到哪个服务端去
data:{},//给服务端带的数据,可以没有,也可以是多个
type:"post", //传递的方式
dataType:"json",//数据传递的格式
success:function(data){}//如果成功返回执行此方法,“data”为自定义名
});
 
1、一般数据处理程序(数据接口):ashx文件
 
2、跨语言传递数据
XML 可扩展的标记语言
  结构不清晰
  代码量比较大
  查找起来比较费事
  非面向对象结构
json
  结构清晰
  代码量相对较小
  面向对象的处理方式,查找数据很简单
 
  基本结构:
    键值对:{"":"","":'',"":""}(英文状态下)
=============================================================
练习:验证用户名是否可用
一、普通方式,不用ajax
前台代码:
<body>
<form id="form1" runat="server">
<div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<asp:TextBox ID="TextBox1" runat="server" AutoPostBack="true"></asp:TextBox>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
</form>
</body>

前台代码

后台代码:

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
TextBox1.TextChanged += TextBox1_TextChanged;
} void TextBox1_TextChanged(object sender, EventArgs e)
{
if (TextBox1.Text == "zhangsan" || TextBox1.Text == "lisi")
{
Label1.Text = "用户名已存在!";
Label1.ForeColor = System.Drawing.Color.Red;
}
else
{
Label1.Text = "恭喜!用户名可以使用!";
Label1.ForeColor = System.Drawing.Color.Green;
}
}
}

后台代码

焦点丢失时触发事件,会重新加载整个页面,用户体验差!

二、ajax局部刷新

前台代码:

<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
</form>
</body>

前台代码

后台代码:

var txt1 = document.getElementById("TextBox1");
txt1.onkeyup = function () {
var v = txt1.value; $.ajax({
url: "../ajax/Handler.ashx",
data: { "txt1": v },
type: "post",
dataType: "json",
success: function (data) {
document.getElementById("Label1").innerHTML = data.ok;
if (data.ok1 == "true") {
document.getElementById("Label1").style.color = "green";
}
else {
document.getElementById("Label1").style.color = "red";
}
}
});
};

js代码

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

using System;
using System.Web; public class Handler : IHttpHandler { public void ProcessRequest (HttpContext context) {
string s=context.Request["txt1"];
string json = "{\"ok\":\"恭喜!用户名可用!\",\"ok1\":\"true\"}"; if (s == "zhangsan" || s == "lisi")
{
json = "{\"ok\":\"此用户名不可用!\",\"ok1\":\"false\"}";
} context.Response.Write(json);
context.Response.End();
} public bool IsReusable {
get {
return false;
}
} }

ashx代码

C#-WebForm-AJAX阿贾克斯(一)基本格式的更多相关文章

  1. $.ajax返回的JSON格式的数据后无法执行success的解决方法

    近段时间做项目,在项目使用了ajax技术,遇到了一个奇怪的问题:"$.ajax返回的JSON格式的数据无法执行success",代码是这样写的: 1 $.ajax({ 2 .. 3 ...

  2. jquery ajax调用返回json格式数据处理

    Ajax请求默认的都是异步的 如果想同步 async设置为false就可以(默认是true) var html = $.ajax({ url: "some.php", async: ...

  3. Ajax中的JSON格式与php传输过程的浅析

    在Ajax中的JSON格式与php传输过程中有哪些要注意的小地方呢? 先来看一下简单通用的JSON与php传输数据的代码 HTML文件: <input type="button&quo ...

  4. ajax日期參数格式问题

    今天遇到ajax传输日期參数后台无法识别的问题,错误异常例如以下. 从异常中能够看出传输到后台的日期数据格式为Thu Aug 13 2015 19:45:20 GMT+0800 (中国标准时间),这样 ...

  5. Django学习——ajax发送其他请求、上传文件(ajax和form两种方式)、ajax上传json格式、 Django内置序列化(了解)、分页器的使用

    1 ajax发送其他请求 1 写在form表单 submit和button会触发提交 <form action=""> </form> 注释 2 使用inp ...

  6. ajax访问服务器返回json格式

    使用ajax访问服务器返回多条数据,比如返回一个表中的所有数据,页面该如何处理呢?如何获取数据呢?一直不会用ajax返回json格式,今天研究了下,分享给大家~ 首先需要引用服务,点击项目右键,添加引 ...

  7. webform ajax 异步请求

    第一种就是对应方法的请求 虽然对应方法 但还是会刷新页面 webform是基于事件的 每次请求都会出发pageload <script> $(function () { $("# ...

  8. (24)ajax上传json格式的数据

    urs.py from django.conf.urls import urlfrom django.contrib import adminfrom app01 import viewsurlpat ...

  9. webform ajax 上传文件+参数

    今天维护webform项目时,有个需求需要在一个ajax中上传excel和多个参数.网上没怎么找到答案,这边做个笔记. 首先上页面大体这样 <form id= "uploadForm& ...

  10. 使用jQuery发送POST,Ajax请求返回JSON格式数据

    问题: 使用jQuery POST提交数据到PHP文件, PHP返回的json_encode后的数组数据,但jQuery接收到的数据不能解析为JSON对象,而是字符串{"code" ...

随机推荐

  1. 最短路径问题/Spfa

    题目链接 题目描述 给你n个点,m条无向边,每条边都有长度d和花费p,给你起点s终点t,要求输出起点到终点的最短距离及其花费,如果最短距离有多条路线, 则输出花费最少的. 最后一行是两个数 s,t;起 ...

  2. Java获取来访者IP

    在JSP里,获取客户端的IP地址的方法是:request.getRemoteAddr(),这种方法在大部分情况下都是有效的.但是在通过了Apache,Squid等反向代理软件就不能获取到客户端的真实I ...

  3. UITableView使用中的一些刁专问题总结

    tableview中cell的系统分隔线问题(分隔线顶满或者缩短) //tableview代理方法,设置系统cell的分隔线 -(void)tableView:(UITableView *)table ...

  4. java 子类与父类继承关系

    People.java public class People { int age,leg = 2,hand = 2; protected void showPeopleMess() { System ...

  5. android经典开源代码集合

    一.依赖注入DI通过依赖注入减少View.服务.资源简化初始化,事件绑定等重复繁琐工作1. AndroidAnnotations(Code Diet) android快速开发框架项目地址:https: ...

  6. 二分图最大匹配 Hopcroft-Karp算法模板

    #include <iostream> #include <cstdlib> #include <cstdio> #include <cstring> ...

  7. 初学HTML5的一点理解

    刚接触了一点点用h5移动端的一点知识,用自己最浅薄的理解来看解决自适应屏幕尺寸问题和适应屏幕尺寸的布局问题.这里,为了解决自适应屏幕尺寸问题大概需要做的就是把HTML中的元素的尺寸尽可能的用百分比表示 ...

  8. 【转】调用getActionBar()报Call requires API level 11 (current min is 8): android.app.Activity#getActionBar

    解决办法: 第一种方法:修改AndroidManifest.xml中的minSdkVersion=11   第二种方法: 1.导入android-support-v7-appcompat项目,并将其作 ...

  9. windows加固方案

    1     账号管理.认证授权.... 1 1.1      账号... 1 1.2      口令... 1 1.3      授权... 2 2     日志配置操作.... 3 3     IP ...

  10. 【简单dp】 poj 2346

    题意:给定一个N 求一共有多少个N位数     前N/2个数的和等于后N/2个数的和思路:令F[i][j] 为sum值为j的i位数的个数则问题转化成 求 sum(F[n/2][j] * F[n/2][ ...