对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 相关文章推荐
通过ifame指向的页面高度调整iframe的高度
Oct 05 Javascript
JavaScript While 循环基础教程
Apr 05 Javascript
JavaScript生成随机数的4种自定义函数分享
Feb 28 Javascript
JS实现控制表格行文本对齐的方法
Mar 30 Javascript
js数字计算 误差问题的快速解决方法
Feb 28 Javascript
angular.js+node.js实现下载图片处理详解
Mar 31 Javascript
Vue 项目部署到服务器的问题解决方法
Dec 05 Javascript
JavaScript面试出现频繁的一些易错点整理
Mar 29 Javascript
jQuery AJAX与jQuery事件的分析讲解
Feb 18 jQuery
jQuery内容过滤选择器与子元素过滤选择器用法实例分析
Feb 20 jQuery
完美解决vue 中多个echarts图表自适应的问题
Jul 19 Javascript
vue实现简易音乐播放器
Aug 14 Vue.js
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
PHP中的正规表达式(二)
2006/10/09 PHP
php 一元分词算法
2009/11/30 PHP
JavaScript 撑出页面文字换行
2009/06/15 Javascript
一些常用且实用的原生JavaScript函数
2010/09/08 Javascript
使用jquery mobile做幻灯播放效果实现步骤
2013/01/04 Javascript
深入document.write()与HTML4.01的非成对标签的详解
2013/05/08 Javascript
关于js数组去重的问题小结
2014/01/24 Javascript
Jquery焦点图实例代码
2014/11/25 Javascript
node.js解决获取图片真实文件类型的问题
2014/12/20 Javascript
javascript如何实现暂停功能
2015/11/06 Javascript
Javascript获取数组中的最大值和最小值的方法汇总
2016/01/01 Javascript
使用 bootstrap modal遇到的问题小结
2016/11/09 Javascript
鼠标点击input,显示瞬间的边框颜色,对之修改与隐藏实例
2016/12/26 Javascript
详谈表单格式化插件jquery.serializeJSON
2017/06/23 jQuery
基于JavaScript表单脚本(详解)
2017/10/18 Javascript
基于vue.js实现的分页
2018/03/13 Javascript
echarts实现折线图的拖拽效果
2019/12/19 Javascript
vue使用map代替Aarry数组循环遍历的方法
2020/04/30 Javascript
Openlayers绘制地图标注
2020/09/28 Javascript
[02:17]快乐加倍!DOTA2食人魔魔法师至宝+迎霜节活动上线
2019/12/22 DOTA
介绍Python中的fabs()方法的使用
2015/05/14 Python
python+requests+unittest API接口测试实例(详解)
2017/06/10 Python
python交互式图形编程实例(一)
2017/11/17 Python
python递归法实现简易连连看小游戏
2020/03/25 Python
tensorflow 20:搭网络,导出模型,运行模型的实例
2020/05/26 Python
python中使用.py配置文件的方法详解
2020/11/23 Python
CSS3按钮鼠标悬浮实现光圈效果源码
2016/09/11 HTML / CSS
兰蔻法国官方网站:Lancôme法国
2020/02/22 全球购物
C/C++有关内存的思考题
2015/12/04 面试题
法务专员岗位职责
2014/01/02 职场文书
会议邀请书范文
2014/02/02 职场文书
高中教师先进事迹材料
2014/08/22 职场文书
2014党员整改措施思想汇报
2014/10/07 职场文书
人间正道是沧桑观后感
2015/06/15 职场文书
mysql部分操作
2021/04/05 MySQL
Django + Taro 前后端分离项目实现企业微信登录功能
2022/04/07 Python