对Jquery中的ajax再封装,简化操作示例


Posted in Javascript onFebruary 12, 2014
<!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">
<head>
    <title>jQueryAjaxJson取值示例</title>
    <script type="text/javascript" src="Scripts/jquery-1.4.4.min.js"></script>
    <script type="text/javascript">
        $(function () {
            jsonAjax("AjaxQuery.aspx", "type=json", "json", callBack);
            jsonAjax("AjaxQuery.aspx", "id=1&name=2&type=text", "text", callBackTxt);
        });
        function callBack(data) {
            $("#ddd").html('');
            var json = eval(data); //数组  
            $.each(json, function (index, item) {
                //循环获取数据
                var name = json[index].Name;
                var age = json[index].Age;
                var sex = json[index].Sex;
                $("#ddd").html($("#ddd").html() + "<br>" + name + "  " + age + "  " + sex + "<br/>");
            });
        };
        function callBackTxt(data) {
            $("#ccc").html(data);
        };
        /**
        * ajax post提交
        * @param url
        * @param param
        * @param datat 为html,json,text
        * @param callback回调函数
        * @return
        */
        function jsonAjax(url, param, datat, callback) {
            $.ajax({
                type: "post",
                url: url,
                data: param,
                dataType: datat,
                success: callback,
                error: function () {
                    jQuery.fn.mBox({
                        message: '恢复失败'
                    });
                }
            });
        }
    </script>
</head>
<body>
    <span id="ccc"></span>
    <span id="ddd"></span>
</body>
</html>

using System;
//新增
using System.Web.Script.Serialization;
using System.Collections.Generic;
public partial class AjaxQuery : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            //数据模拟,仅供参考
            string messgage = string.Empty;
            string id = Request["id"];
            string name = Request["name"];
            string gettype = Request["type"];
            if (gettype=="text")
            {
                messgage = (id == "1" && name == "2") ? "ok符合条件" : "sorry不符合条件";
            }
            else if (gettype == "json")
            {
                List<Student> list = new List<Student>();
                for (int i = 0; i < 50; i++)
                {
                    Student a = new Student();
                    a.Name = "张三" + i;
                    a.Age = i;
                    a.Sex = "男";
                    list.Add(a);
                }
                messgage = new JavaScriptSerializer().Serialize(list); 
            }
            else
            { }
            Response.Write(messgage);
            Response.End();
        }
    }
    public struct Student
    {
        public string Name;
        public int Age;
        public string Sex;
    }
}
Javascript 相关文章推荐
jQuery 学习第七课 扩展jQuery的功能 插件开发
May 17 Javascript
javascript 系统文件夹文件操作及参数介绍
Jan 08 Javascript
JS保留小数点(四舍五入、四舍六入)实现思路及实例
Apr 25 Javascript
jquery实现瀑布流效果分享
Mar 26 Javascript
jquery.gridrotator实现响应式图片展示画廊效果
Jun 23 Javascript
JQuery fileupload插件实现文件上传功能
Mar 18 Javascript
全屏滚动插件fullPage.js使用实例解析
Oct 21 Javascript
微信小程序 在线支付功能的实现
Mar 14 Javascript
微信小程序顶部可滚动导航效果
Oct 31 Javascript
jquery animate动画持续运动的实例
Nov 29 jQuery
详解JavaScript函数callee、call、apply的区别
Mar 08 Javascript
vue中多路由表头吸顶实现的几种布局方式
Apr 12 Javascript
Jquery Ajax解析XML数据(同步及异步调用)简单实例
Feb 12 #Javascript
利用JQuery和Servlet实现跨域提交请求示例分享
Feb 12 #Javascript
jquery ajax,ashx,json的用法总结
Feb 12 #Javascript
Jquery中ajax方法data参数的用法小结
Feb 12 #Javascript
利用jquery.qrcode在页面上生成二维码且支持中文
Feb 12 #Javascript
Jquery中国地图热点效果-鼠标经过弹出提示层信息的简单实例
Feb 12 #Javascript
JavaScript cookie的设置获取删除详解
Feb 11 #Javascript
You might like
基于Windows下Apache PHP5.3.1安装教程
2010/01/08 PHP
超小PHP小马小结(方便查找后门的朋友)
2012/05/05 PHP
js 加载时自动调整图片大小
2008/05/28 Javascript
js 设置缓存及获取设置的缓存
2014/05/08 Javascript
javascript与css3动画结合使用小结
2015/03/11 Javascript
举例详解AngularJS中ngShow和ngHide的使用方法
2015/06/19 Javascript
简述AngularJS相关的一些编程思想
2015/06/23 Javascript
JavaScript中this的9种应用场景及三种复合应用场景
2015/09/12 Javascript
深入探讨javascript函数式编程
2015/10/11 Javascript
vue 自定义组件 v-model双向绑定、 父子组件同步通信的多种写法
2017/11/27 Javascript
JS实现左边列表移到到右边列表功能
2018/03/28 Javascript
angular实现页面打印局部功能的思考与方法
2018/04/13 Javascript
vue自定义指令的创建和使用方法实例分析
2018/12/04 Javascript
JavaScript 浏览器对象模型BOM原理与常见用法实例分析
2019/12/16 Javascript
[05:08]2014DOTA2国际邀请赛 Hao专访复仇的胜利很爽
2014/07/15 DOTA
python网络编程示例(客户端与服务端)
2014/04/24 Python
十行代码使用Python写一个USB病毒
2019/06/21 Python
win10环境下配置vscode python开发环境的教程详解
2019/10/16 Python
使用 Supervisor 监控 Python3 进程方式
2019/12/05 Python
HEMA法国:荷兰原创设计
2019/02/21 全球购物
俄罗斯最大的在线手表商店:Bestwatch.ru
2020/01/11 全球购物
初一家长会邀请函
2014/01/31 职场文书
党员创先争优公开承诺书
2014/03/28 职场文书
连带责任保证书
2014/04/29 职场文书
幼儿教师暑期培训方案
2014/08/27 职场文书
英语自我介绍演讲稿
2014/09/01 职场文书
2014入党积极分子批评与自我批评思想汇报
2014/09/20 职场文书
债务纠纷委托书范本
2014/10/14 职场文书
关于安全的广播稿
2014/10/23 职场文书
苦儿流浪记读书笔记
2015/07/01 职场文书
运动会通讯稿200字
2015/07/20 职场文书
2015年安全生产月工作总结
2015/07/27 职场文书
2015秋季田径运动会广播稿
2015/08/19 职场文书
sql server 累计求和实现代码
2022/02/28 SQL Server
postgreSQL数据库基础知识介绍
2022/04/12 PostgreSQL
Android存储中最基本的文件存储方式
2022/04/30 Java/Android