• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > ajax与json 获取数据并在前台使用简单实例

ajax与json 获取数据并在前台使用简单实例

作者: 字体:[增加 减小] 来源:互联网 时间:2017-05-11

通过本文主要向大家介绍了ajax json实例,java ajax json实例,jquery ajax json实例,jsp ajax json实例,php ajax json实例等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

用ajax获取后台数据,返回json数据,怎么在前台使用呢?

后台


if (dataType == "SearchCustomer")
        {
          int ID;
          if (Int32.TryParse(CustomerID, out ID))
          {
            string s = GridComputer.GridCustomer.getCustomer(1, 1, ID);
            if (s == null)
            {
              context.Response.ContentType = "text/plain";
              context.Response.Write("[{\"name\":无用户,\"id\":\"0\",\"company\":\"无用户\"}]");
            }
            else { context.Response.Write(s); }
          }
 
        } 

</div>

前台


 $(document).ready(function () {
      $("#Button3").click(
    function (SucCallback) {
      $.ajax(
      {
        type: "get",
        url: 'GridDatas.ashx', //后台处理程序  
        dataType: 'json',   //接受数据格式  
        data: 'DataType=SearchCustomer&CustomerID=' + document.getElementById("Text3").value,     //要传递的数据  
        success:SucCallback,
        error: function () { alert("error"); }
      });
    })
    })

</div>

参考代码

grid.getCustomer(1,2,function (data) {
    var list = '<p>' + tree_GridInfo._name + '的用户有</p><br>';
    list += '<table id="customers"><tr><th>姓名</th><th>电话</th></tr> ';
    $.each(data, function (i, n) {
      list += '<tr onclick="showUser(' + 1 + ')"><td>';
      list += n.name + '</td>' + '<td>' + n.company;
      list += '</td></tr>';
    });
    $("#SearchResult").html(list)

</div>

看你的json数据是列表还是单个了,就一条就无需中括号了

context.Response.Write("{\"name\":无用户,\"id\":\"0\",\"company\":\"无用户\"}");

$(document).ready(function () {
      $("#Button3").click(
    function (SucCallback) {
      $.ajax(
      {
        type: "get",
        url: 'GridDatas.ashx', //后台处理程序  
        dataType: 'json',   //接受数据格式  
        data: 'DataType=SearchCustomer&CustomerID=' + document.getElementById("Text3").value,     //要传递的数据  
        function (dataJson) {
           alert(dataJson.Name);
           alert(dataJson.Id);
        },
        error: function () { alert("error"); }
      });
    })
    })

</div>

 感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • json的结构与遍历方法实例分析
  • JSON 数据详解及实例代码分析
  • ajax与json 获取数据并在前台使用简单实例
  • jQuery使用ajax方法解析返回的json数据功能示例
  • jQuery基于ajax操作json数据简单示例

相关文章

  • 2017-05-11js实现打地鼠小游戏
  • 2017-05-11Javascript DOM事件操作小结(监听鼠标点击、释放,悬停、离开等)
  • 2017-05-11js 颜色选择插件
  • 2017-05-11canvas实现流星雨的背景效果
  • 2017-05-11Vue.js -- 过滤器使用总结
  • 2017-05-11AngularJS中update两次出现$promise属性无法识别的解决方法
  • 2017-05-11Angularjs 依赖压缩及自定义过滤器写法
  • 2017-05-11ES6数组的扩展详解
  • 2017-05-11EsLint入门学习教程
  • 2017-05-11js轮播图透明度切换(带上下页和底部圆点切换)

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • JS 编码,解码
    • jQuery基于正则表达式的表单验证功能示例
    • Bootstrap页面标题Page Header的实现方法
    • 十大热门的JavaScript框架和库
    • select下拉框插件jquery.editable-select详解
    • 简单谈谈gulp-changed插件
    • fullPage.js和CSS3实现全屏滚动效果
    • 基于vue实现分页/翻页组件paginator示例
    • 浅谈Vue.js
    • 微信小程序 网络请求(post请求,get请求)

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有