简单的ajax、json、jquery应用

来源：互联网发布：中小学生网络作文大赛编辑：程序博客网时间：2024/06/05 18:15

今天刚学了ajax、json、jquery的简单应用，写篇日记记录。

这是在aspx用这三个技术。先引入两个jquery框架：jquery-1.4.1.js和jquery-1.4.1.min.js（压缩文件），新建一个网站，到网站的Scripts文件夹里去把这两个文件copy到你的网站项目中去。接着到扩展管理器中去搜索Nuget，找到Nuget程序管理器并下载。

再右击项目的引用，选择“管理NuGet程序包”，

搜索Json.Net，选择后点击安装。

接下来就是编码了。

WebForm1.aspx代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script><head runat="server">    <title>json.ajax.jquery</title></head><body>    <form id="form1" runat="server">        <script type="text/javascript" language="javascript">        $(document).ready(function () {            GetUser();        });        function GetUser() {            $.ajax({                type: "POST",                async: false,                contentType: "application/json",                url: "WebForm1.aspx/json",                dataType: 'json',                success: function (result) {                    var datas = jQuery.parseJSON(result.d);                    var s = datas.UserName + datas.Content + datas.Time + datas.Adress;                    alert(s);                },                error: function () {                }            });        }   </script>    </form></body></html>

WebForm1.aspx.cs代码：

using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.Services;using Newtonsoft.Json;namespace WebApplication1{    public partial class WebForm1 : System.Web.UI.Page    {        protected void Page_Load(object sender, EventArgs e)        {        }        [WebMethod]        public static string json()        {            User user = new User();            user.UserName = "毛罗";            user.Content = "比拉诺瓦基本保留瓜迪奥拉打法路数，结果被皇马拜仁杀得头破血流，马蒂诺选择变通，是明智之举，塔塔不是冥顽不灵的教条化主帅";            user.Time = "14:30";            user.Adress = "西班牙马德里";            string jsonstr = JsonConvert.SerializeObject(user);            return jsonstr;        }    }    public class User    {         public string UserName { get; set; }        public string Content { get; set; }        public string Time { get; set; }        public string Adress { get; set; }    }}

页面效果：