JQuery使用Ajax的一个简单应用

利用Jquery开发Ajax。这是一格最简单应用了,点击页面上按钮后，异步加载数据。
以下是html页面：
 1<%@ Page Language="C#" AutoEventWireup="true" CodeFile="JqueryTest.aspx.cs" Inherits="JqueryTest" %>
 2<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 3<html xmlns="http://www.w3.org/1999/xhtml">
 4<head runat="server">
 5    <title>无标题页</title>
 6    <script language="javascript" type="text/javascript" src="js/jquery.js"></script>
 7      <script language="javascript" type="text/javascript" src="js/ajax.js"></script>
 8</head>
 9<body>
10    <form id="form1" runat="server">
11    <div id="divtest"></div>
12    <input type="button" id="btncl"  value="数据" />
13    <div id="divtest2">
14    </div>
15    <div class="ajax"></div>
16    </form>
17</body>
18</html>
19
一个js文件，用于数据操作
$(function(){
$("#btncl").click(function(){
 $.ajax({
    url: "Ajax.aspx",
    type: "post",
    data:"oper=gettext",
   
    success: function(data,textStatus){
    $('#divtest').css('background', 'yellow').html(data).show();
    alert(textStatus);
    $("#divtest2").html(data);
    },
     error: function(o){
     //   alert(o.responseText);
    }
});
});
});

$(document).ready(function(){alert("欢迎")});
说明:页面加载时显示欢迎，点击button后调用后台ajax.aspx.cs中的数据。
以下是ajax.aspx.cs文件:
 1using System;
 2using System.Collections;
 3using System.Configuration;
 4using System.Data;
 5using System.Linq;
 6using System.Web;
 7using System.Web.Security;
 8using System.Web.UI;
 9using System.Web.UI.HtmlControls;
10using System.Web.UI.WebControls;
11using System.Web.UI.WebControls.WebParts;
12using System.Xml.Linq;
13
14public partial class Ajax : System.Web.UI.Page
15{
16    protected string resposne = "";
17    protected void Page_Load(object sender, EventArgs e)
18    {
19        string oper = Request.Form["oper"];
20       // resposne = "324345";
21        switch (oper)
22        {
23            case "gettext":
24                Gettext();
25                break;
26            default:
27                break;
28        }
29        Response.Write(resposne);
30        Response.End();
31    }
32
33    private void Gettext()
34    {
35        this.resposne = "123";
36    }
37}
38
很简单吧......

Tag标签: jquery,Ajax
posted @ 2008-06-26 17:55 水平线 阅读(176) 评论(2)  编辑 收藏

  回复  引用    
#1楼 2008-06-27 08:42 | 随风飘扬 [未注册用户]
用 $.post 你回发现更简单。。
  回复  引用  查看    
#2楼 [楼主]2008-06-27 15:50 | 水平线      
@随风飘扬
是的，$.post更简单。

标题  
姓名  
主页
Email (只有博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      


相关链接:

最新IT新闻:
马云vs孙正义：两个“疯子”的对话
消息称MySQL创始人已向Sun提交辞呈
谷歌Chrome浏览器即将更换LOGO颜色？
淘宝网合并阿里妈妈 专家称阿里巴巴或有新战略
微软研究院发布 AutoCollage - 整理并融合照片
博客园新闻频道  博客园首页  社区