对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 相关文章推荐
javascript 可以拖动的DIV(二)
Jun 26 Javascript
js,jquery滚动/跳转页面到指定位置的实现思路
Jun 03 Javascript
我的Node.js学习之路(四)--单元测试
Jul 06 Javascript
jquery中toggle函数交替使用问题
Jun 22 Javascript
JS+Canvas实现的俄罗斯方块游戏完整实例
Dec 12 Javascript
js点击任意区域弹出层消失实现代码
Dec 27 Javascript
jQuery实现jQuery-form.js实现异步上传文件
Apr 28 jQuery
深入理解Vue 的条件渲染和列表渲染
Sep 01 Javascript
使用Vuex实现一个笔记应用的方法
Mar 13 Javascript
vue构建动态表单的方法示例
Sep 22 Javascript
小程序实现订单倒计时功能
Apr 23 Javascript
JS异步宏队列与微队列原理区别详解
Jul 02 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
在PHP3中实现SESSION的功能(三)
2006/10/09 PHP
yii2中的rules 自定义验证规则详解
2016/04/19 PHP
微信公众号实现会员卡领取功能
2017/06/08 PHP
4种Windows系统下Laravel框架的开发环境安装及部署方法详解
2020/04/06 PHP
Tinymce+jQuery.Validation使用产生的BUG
2010/03/29 Javascript
Javascript引用指针使用介绍
2012/11/07 Javascript
JS定时刷新页面及跳转页面的方法
2013/07/04 Javascript
json格式的时间显示为正常年月日的方法
2013/09/08 Javascript
Javascript代码实现仿实例化类
2015/04/03 Javascript
JS绘制生成花瓣效果的方法
2015/08/05 Javascript
jQuery动态添加及删除表单上传元素的方法(附demo源码下载)
2016/01/15 Javascript
Bootstrap创建可折叠的组件
2016/02/23 Javascript
Ionic如何实现下拉刷新与上拉加载功能
2016/06/03 Javascript
Jquery通过ajax请求NodeJS返回json数据实例
2016/11/08 NodeJs
jQuery实现导航回弹效果
2017/02/27 Javascript
解决vue build打包之后首页白屏的问题
2018/03/06 Javascript
Node.js Buffer用法解读
2018/05/18 Javascript
Nuxt.js nuxt-link与router-link的区别说明
2020/11/06 Javascript
基于Vue3.0开发轻量级手机端弹框组件V3Popup的场景分析
2020/12/30 Vue.js
python使用webbrowser浏览指定url的方法
2015/04/04 Python
进一步了解Python中的XML 工具
2015/04/13 Python
Python编程判断一个正整数是否为素数的方法
2017/04/14 Python
Python实现调用另一个路径下py文件中的函数方法总结
2018/06/07 Python
Python实现的绘制三维双螺旋线图形功能示例
2018/06/23 Python
Python 使用 Pillow 模块给图片添加文字水印的方法
2019/08/30 Python
Python中猜拳游戏与猜筛子游戏的实现方法
2020/09/04 Python
泰国第一在线超市:Tops
2021/02/13 全球购物
生产厂厂长岗位职责
2013/12/25 职场文书
电台编导求职信
2014/05/06 职场文书
资助贫困学生倡议书
2014/05/16 职场文书
国际会计专业求职信
2014/08/04 职场文书
个人三严三实对照检查材料思想汇报
2014/09/22 职场文书
2014教师年度思想工作总结
2014/11/10 职场文书
我爱我班主题班会
2015/08/13 职场文书
52条SQL语句教你性能优化
2021/05/25 MySQL
Springboot使用Spring Data JPA实现数据库操作
2021/06/30 Java/Android