<!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;

    }

}

对Jquery中的ajax再封装,简化操作的更多相关文章

  1. JavaScript原生封装ajax请求和Jquery中的ajax请求

    前言:ajax的神奇之处在于JavaScript 可在不重载页面的情况与 Web 服务器交换数据,即在不需要刷新页面的情况下,就可以产生局部刷新的效果.Ajax 在浏览器与 Web 服务器之间使用异步 ...

  2. 深入理解ajax系列第九篇——jQuery中的ajax

    前面的话 jQuery提供了一些日常开发中需要的快捷操作,例如load.ajax.get和post等,使用jQuery开发ajax将变得极其简单.这样开发人员就可以将程序开发集中在业务和用户体验上,而 ...

  3. jQuery入门（4）jQuery中的Ajax应用

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  4. 【Java EE 学习 33 上】【JQuery样式操作】【JQuery中的Ajax操作】【JQuery中的XML操作】

    一.JQuery中样式的操作 1.给id=mover的div采用属性增加样式.one $("#b1").click(function(){ $("#mover" ...

  5. 浅谈jQuery中的Ajax

    浅谈jQuery中的Ajax 一.前言 jQuery 对 Ajax 操作进行了封装, 在 jQuery 中最底层的方法时 $.ajax(), 第二层是 load(), $.get() 和 $.post ...

  6. 从零开始学习jQuery (六) jquery中的AJAX使用

    本篇文章讲解如何使用jQuery方便快捷的实现Ajax功能.统一所有开发人员使用Ajax的方式. 一.摘要 本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案,  即 ...

  7. Jquery中的Ajax

    AJAX: * jQuery中的Ajax * 封装第一层 - 类似于原生Ajax的用法 * $.ajax() - 最复杂 * 选项 * url - 请求地址 * type - 请求类型,默认为GET ...

  8. jquery中的ajax参数

    jquery中将ajax封装成了函数,我们使用起来非常方便,jquery会自动根据内容选择post还是get方式提交数据,并且会自动编码,但是要想完全掌握jquery中的ajax,我们必须将它的各个参 ...

  9. 两强相争，鹿死谁手 — JQuery中的Ajax与AngularJS中的$http

    一.JQuery与AngularJS 首先,先简单的了解一下JQuery与AngularJS.从源头上来说,两者都属于原生JS所封装成的库,两种为平行关系. 二.Ajax请求与数据遍历打印 这里是Aj ...

随机推荐

  1. webpack2学习日志

    webpack说容易也容易,说难也难,主要还是看个人,想学到什么样的程度,很多公司可能要求仅仅是会用就行,但是也有一些公司要求比较高,要懂一些底层的原理,所以还是要花一些时间的,看个人需求.这篇仅仅是 ...

  2. jQuery学习目录

    前面的话 目前来说,jQuery可能已经不再处于人们的话题中心.人们讨论的更多的是Vue.Angular和React.但是,jQuery的使用量依然广泛,据统计,它仍然是目前使用率最高的javascr ...

  3. 【集美大学1411_助教博客】alpha阶段后 成绩

    团队作业7 成绩(助教对团队排名) 团队名称 设想和目标 计划 资源 变更管理 设计/实现 测试/发布 团队的角色,管理,合作 总结 全组讨论的照片 团队成员在Alpha阶段的角色和具体贡献 合计 排 ...

  4. Swing-JDialog示例代码-用户登陆UI

    JDialog是一种对话框组件,它常常与JOptionPane配合使用.JOptionPane提供对话框内部的消息.按钮等内容,JDialog提供对话框窗体,提供模态/非模态等属性.JDialog与J ...

  5. 201521123118《java程序与设计》第七次作业

    1. 本周学习总结 以你喜欢的方式(思维导图或其他)归纳总结集合相关内容. 2. 书面作业 1. ArrayList代码分析 1.1 解释ArrayList的contains源代码 public bo ...

  6. 201521123014 《Java程序设计》第5周学习总结

    1. 本周学习总结 1.1 尝试使用思维导图总结有关多态与接口的知识点. 2. 书面作业 Q1. 代码阅读:Child压缩包内源代码 1.1 com.parent包中Child.java文件能否编译通 ...

  7. 201521123069 《Java程序设计》 第2周学习总结

    1. 本章学习总结 (1)String类.StringBuilder类(频繁进行字符串的修改应选用StringBuilder,不会生成大量的字符串对象).Math类的用法.字符串池的概念 (2)Sca ...

  8. 201521123071《Java程序设计》第1周学习总结

    1. 本章学习总结 通过本周的学习,对java的一些语法以及java的发展史有了一定的基础认识,也了解了JDK的安装,以及环境变量定义和配置等知识.还有对码云,Markdown等的使用,大大方便了我们 ...

  9. 参加IMWebConf 2017 前端开发者大会是什么体验？

    周六作为特邀讲师之一参加了IMWebConf 2017 前端开发者大会的主题演讲,主题为<WebAssembly:面向未来的web开发技术>.本次大会质量非常高,来自国内外的技术专家带了很 ...

  10. Activiti第二篇【管理流程定义、执行任务和流程实例、流程变量】

    上篇Activiti只是一个快速入门案例,这篇就讲定义.部署.查看任务等等的一些细节[涉及到的数据库表.对象等等]- 管理流程定义 管理流程定义主要涉及到以下的4张表: -- 流程部署相关的表 SEL ...