<!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. grunt对象之api

    grunt已经扯了七篇了,殊为不易.最后一篇扯点早应该提及的东西,就是module.exports = function(grunt) {}传入的这个grunt.之前的代码grunt一般只出现在Gru ...

  2. Java 关于路径

    在eclipse中如果没有指名文件的路径的话,系统默认是与src同一级别的目录路径!

  3. cmake命令收集

    cmake中一些预定义变量 PROJECT_SOURCE_DIR 工程的根目录 PROJECT_BINARY_DIR 运行cmake命令的目录,通常是${PROJECT_SOURCE_DIR}/bui ...

  4. dnsmasq一次成功的配置

    第一次用这个小软件,感觉还不错,因为没有像bind那样配置起来繁琐,并且我们也不需要去配置很多文件,内外网访问互不干涉. 我是在centos6.5下进行配置的: 先说说自己的理解: dnsmasq先去 ...

  5. 201521123051《Java程序设计》第八周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 1.2 选做:收集你认为有用的代码片段 集合与泛型综合示例 import java.util.ArrayLis ...

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

    1. 本周学习总结 2. 书面作业 Q1.clone方法 1.1 Object对象中的clone方法是被protected修饰,在自定义的类中覆盖clone方法时需要注意什么? 子类要实现Clonea ...

  7. 201521123076 《Java程序设计》 第十四周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多数据库相关内容. 2. 书面作业 1. MySQL数据库基本操作 建立数据库,将自己的姓名.学号作为一条记录插入.(截图,需出现自 ...

  8. 201521123064 《Java程序设计》第14周学习总结

    本次作业参考文件 数据库PPT MySql操作视频与数据库相关jar文件请参考QQ群文件. 1. 本章学习总结 1.1 以你喜欢的方式(思维导图.OneNote或其他)归纳总结数据库相关内容. 1.数 ...

  9. 201521145048《java程序设计》第10周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常与多线程相关内容. 2. 书面作业 本次PTA作业题集异常.多线程 Q1.finally 题目4-2 1.1 截图你的提交结果( ...

  10. paxos 算法原理学习

    下面这篇关于paxos分布式一致性的原理,对入门来说比较生动有趣,可以加深下影响.特此博客中记录下. 讲述诸葛亮的反穿越 0.引子 一日,诸葛亮找到刘备,突然献上一曲<独角戏>,而后放声大 ...