jQuery+ajax+asp.net获取Json值的方法


Posted in Javascript onJune 08, 2016

本文实例讲述了jQuery+ajax+asp.net获取Json值的方法。分享给大家供大家参考,具体如下:

<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">
    $(document).ready(function () {
      $("#Button1").click(function () {
        $.ajax({
          url: 'AjaxQuery.aspx',
          type: 'GET',
          dataType: 'json',
          timeout: 1000,
          cache: false,
          beforeSend: LoadFunction, //加载执行方法
          error: erryFunction, //错误执行方法
          success: succFunction //成功执行方法
        })
        function LoadFunction() {
          $("#ddd").html('加载中...');
        }
        function erryFunction() {
          alert("error");
        }
        function succFunction(tt) {
          $("#ddd").html('');
          var json = eval(tt); //数组
          $.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/>");
          });
        }
      });
    })
  </script>
</head>
<body>
  <input type="button" id="Button1" value="获取json数据" />
  <span id="ddd"></span>
</body>
</html>
//Ajax Post Text
function savedata(tempid) {
  var tid = $('#hidtemplate').attr('value');
  var desc = $("#contentdiv").html();
  var num_iid = $("#num_iidArr").attr('value');
  var num_iid2 = $("#num_iidArr001").attr('value'); //发布页面
  var topsvalue = $("#tops").attr('value');
  if (num_iid != "" && num_iid2 != "") {
    $.ajax({
      url: 'TabBaoHandler.ashx',
      type: 'POST',
      data: 'type=3&num_iid=' + num_iid2 + '&tid=' + tid + '&desc=' + desc + '&top_session=' + topsvalue,
      dataType: 'text',
      timeout: 20000,
      cache: false,
      //async: false, //同步
      beforeSend: LoadFunction, //加载执行方法
      error: erryFunction, //错误执行方法
      success: succFunction //成功执行方法
    })
    function LoadFunction() {
      showLoad("正在运行中...");
    }
    function erryFunction() {
      $("#contentdiv").html("<p style=\"padding:5px\"><img src=\"images/error.png\" />sorry,提交失败</p>");
      closeLoad();
    }
    function succFunction(tt) {
      closeLoad();
      $("#contentdiv").show().html(tt);
    }
  } else {
    alert("请选择后再操作");
  }
}
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)
    {
      List<Student> list = new List<Student>();
      Student c = new Student();
      c.Name = "张三";
      c.Age = 23;
      c.Sex = "男";
      list.Add(c);
      Student cc = new Student();
      cc.Name = "李四";
      cc.Age = 25;
      cc.Sex = "男";
      list.Add(cc);
      Student ccc = new Student();
      ccc.Name = "李玲";
      ccc.Age = 25;
      ccc.Sex = "女";
      list.Add(ccc);
      Response.ContentType = "application/json";
      Response.Write(new JavaScriptSerializer().Serialize(list));////这个很关键,否则error
      Response.End();
    }
  }
  public struct Student
  {
    public string Name;
    public int Age;
    public string Sex;
  }
}
Javascript 相关文章推荐
根据邮箱的域名跳转到相应的登录页面的代码
Feb 27 Javascript
jQuery点击后一组图片左右滑动的实现代码
Aug 16 Javascript
jquery增加时编辑jqGrid(实例代码)
Nov 08 Javascript
jquery 鼠标滑动显示详情应用示例
Jan 24 Javascript
jquery获取radio值(单选组radio)
Oct 16 Javascript
jquery使用slideDown实现模块缓慢拉出效果的方法
Mar 27 Javascript
PHPMyAdmin导入时提示文件大小超出PHP限制的解决方法
Mar 30 Javascript
jQuery代码实现对话框右上角菜单带关闭×
May 03 Javascript
angularjs实现的前端分页控件示例
Feb 10 Javascript
浅析JS抽象工厂模式
Dec 14 Javascript
简单了解微信小程序的目录结构
Jul 01 Javascript
layui table去掉右侧滑动条的实现方法
Sep 05 Javascript
jQuery焦点图轮播插件KinSlideshow用法分析
Jun 08 #Javascript
JavaScript必知必会(十) call apply bind的用法说明
Jun 08 #Javascript
AngularJs学习第八篇 过滤器filter创建
Jun 08 #Javascript
jQuery数据检索中根据关键字快速定位GridView指定行的实现方法
Jun 08 #Javascript
jquery模拟多级复选框效果的简单实例
Jun 08 #Javascript
Jquery揭秘系列:ajax原生js实现详解(推荐)
Jun 08 #Javascript
JavaScript中style.left与offsetLeft的使用及区别详解
Jun 08 #Javascript
You might like
经典的PHPer为什么被认为是草根?
2007/04/02 PHP
使用URL传输SESSION信息
2015/07/14 PHP
Yii2 GridView实现列表页直接修改数据的方法
2016/05/16 PHP
针对多用户实现头像上传功能PHP代码 适用于登陆页面制作
2016/08/17 PHP
Laravel框架搜索分页功能示例
2019/02/01 PHP
php框架CI(codeigniter)自动加载与自主创建对象操作实例分析
2020/06/06 PHP
firefox插件Firebug的使用教程
2010/01/02 Javascript
在IE 浏览器中使用 jquery的fadeIn() 效果 英文字符字体加粗
2011/06/02 Javascript
基于Jquery实现键盘按键监听
2014/05/11 Javascript
JavaScript设计模式初探
2016/01/07 Javascript
深入理解关于javascript中apply()和call()方法的区别
2016/04/12 Javascript
WEB前端开发框架Bootstrap3 VS Foundation5
2016/05/16 Javascript
JS实现的RGB网页颜色在线取色器完整实例
2016/12/21 Javascript
详解Node.js 命令行程序开发教程
2017/06/07 Javascript
Angular5中调用第三方js插件的方法
2018/02/26 Javascript
一个Vue视频媒体多段裁剪组件的实现示例
2018/08/09 Javascript
vue.js实现带日期星期的数字时钟功能示例
2018/08/28 Javascript
详解Vue源码学习之双向绑定
2019/04/10 Javascript
微信小程序中weui用法解析
2019/10/21 Javascript
vue.js 解决v-model让select默认选中不生效的问题
2020/07/28 Javascript
解决VueCil代理本地proxytable无效报错404的问题
2020/11/07 Javascript
浅谈numpy数组的几种排序方式
2017/12/15 Python
查看TensorFlow checkpoint文件中的变量名和对应值方法
2018/06/14 Python
利用python如何在前程无忧高效投递简历
2019/05/07 Python
pyqt 实现为长内容添加滑轮 scrollArea
2019/06/19 Python
python opencv将表格图片按照表格框线分割和识别
2019/10/30 Python
Python中如何引入第三方模块
2020/05/27 Python
详解scrapy内置中间件的顺序
2020/09/28 Python
Django Form常用功能及代码示例
2020/10/13 Python
Django执行源生mysql语句实现过程解析
2020/11/12 Python
Python 远程开关机的方法
2020/11/18 Python
基于HTML5 Canvas:字符串,路径,背景,图片的详解
2013/05/09 HTML / CSS
会计自荐书
2013/12/02 职场文书
网上祭先烈心得体会
2014/09/01 职场文书
英文版辞职信
2015/02/28 职场文书
五一晚会主持词
2015/07/01 职场文书