前面已经封装好了一个方法ajax()，通过这个方法可以实现Ajax请求，接下来就是给出

例程来测试这个方法和实现简单的功能。

  视图的部分代码如下：

<body>

    <div>

        the Numger is :                <br /><label id="number">  </label>  <br />

        the Students' Infomation:<br /><label id="studentInfo">   </label>  <br />

        <input type="button" value="请求数字(ajax请求)" onclick='requestNumber()'/>

        <label>  </label>

        <input type="button" value="请求学生信息(json请求)" onclick="requestStudentInfo()" />

    </div>

</body>

功能一：浏览器向服务器请求一个数字（通过ajax实现）

视图代码中添加脚本代码：

 <script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>

 <script src="../../Scripts/ajax.js" type="text/javascript"></script>

 <script src="../../Scripts/common.js" type="text/javascript"></script>

 <script language="javascript" type="text/javascript">

    //请求数字

   function requestNumber() {

        ajax("POST","/Home/Get_Number", function (resText) {

           //直接接收Ajax请求返回的内容

           var text = resText;

           $("number").innerHTML = text;

        });

   }

14 </script>

后台服务器代码：

 //ajax请求的action方法

 public void Get_Number()

 {

     int num =;

     Response.Write(num);

     return;

 }

功能二：浏览器向服务器请求一个学生的信息（通过Json实现）

视图代码中添加脚本代码：

 //请求学生信息

 function requestStudentInfo() {

     ajax("POST","/Home/Get_Student", function (resText) {

         //将序列化的字符串内容进行解析，得到Js对象

         var student = JSON.parse(resText);

         var text="";

         text += "学号：" + student.StuId  + "<br />";

         text += "姓名：" + student.Name   + "<br />";

         text += "性别：" + student.Gender + "<br />";

         text += "年龄：" + student.Age    + "<br />"

         $("studentInfo").innerHTML = text;

     });

 }

代码中使用到了一个方法JSON.parse(),该方法是将返回的序列化字符串解析成一个对象或者对象集合，
因此需要添加js库--json2.js,如下：

<script src="../../Scripts/json2.js" type="text/javascript"></script>

后台服务器代码：

 //json请求的action方法

 public JsonResult Get_Student()

 {

     Student student = new Student(, "张三","男",);

     return Json(student);  //Json()方法将一个对象或者对象集合进行序列化

 }

运行结果：

总结：通过封装好的ajax()方法实现了向服务器请求一个数字和一个学生信息对象的功能，

ajax请求和json请求没有本质上的区别，两者都是通过ajax()方法来发送XMLHttpRequest

请求，只是ajax请求就直接接收返回的数据就可以了，而json请求需要将接收到的序列化字

符串解析成JS对象或者对象集合(反序列化)，同时也要求服务器端将对象或者对象集合序列化

成字符串进行发送(序列化)。

实现基本的Ajax和Json请求的更多相关文章

  1. 转-----实现基本的Ajax和Json请求

    前面已经封装好了一个方法ajax(),通过这个方法可以实现Ajax请求,接下来就是给出 例程来测试这个方法和实现简单的功能.   视图的部分代码如下: 1 2 3 4 5 6 7 8 9 <bo ...

  2. 自用ajax的json请求

    function singlePriceSubmit(){ var json={}; json["area"]=areaStr1; json["goodCateIdStr ...

  3. servlet 中处理 json 请求，并访问 service 类，返回处理结果

    前言:jar 包中的 servlet 必须可以处理前端发出的 ajax 请求,接收参数,并返回结果. github地址:yuleGH github 这里有个约定,url 地址是 .json 结尾的,如 ...

  4. AJAX 中JSON 和JSONP 的区别 以及请求原理

    AJAX 跨域请求 - JSONP获取JSON数据 博客分类: Javascript /Jquery / Bootstrap / Web   Asynchronous JavaScript and X ...

  5. Jquery DataTable AJAX跨域请求的解决方法及SSM框架下服务器端返回JSON格式数据的解决方法

    如题,用HBuilder开发APP,涉及到用AJAX跨域请求后台数据,刚接触,费了不少时间.幸得高手指点,得以解决. APP需要用TABLE来显示数据,因此采用了JQ 的DataTable.  在实现 ...

  6. jQuery:多个AJAX/JSON请求对应单个回调

    原文链接:jQuery: Multiple AJAX and JSON Requests, One Callback 原文日期: 2014年4月15日 翻译日期: 2014年4月22日 翻译人员: 铁 ...

  7. Ajax跨域之ContentType为application/json请求失败的问题

    项目里的接口都是用springmvc写的,其中在@requestmapping接口中定义了consumes="application/json",也就是该接口只接受ContentT ...

  8. AJAX跨域请求json数据的实现方法

    这篇文章介绍了AJAX跨域请求json数据的实现方法,有需要的朋友可以参考一下 我们都知道,AJAX的一大限制是不允许跨域请求. 不过通过使用JSONP来实现.JSONP是一种通过脚本标记注入的方式, ...

  9. jQuery 发送 ajax json 请求。。

    $.extend({ postJson: function (data) { data = data || {} $.ajax({ type: "POST", url: data. ...

随机推荐

  1. Android实现按两次back键退出应用

    重写onKeyDown()方法 System.currentTimeMillis():该方法的作用是返回当前的计算机时间,时间的表达格式为当前计算机时间和GMT时间(格林威治时间)1970年1月1号0 ...

  2. Go学习笔记一：解析toml配置文件

    本文系作者原创,转载请注明出处https://www.cnblogs.com/sonofelice/p/9085291.html . 一些mysql或者日志路径的信息需要放在配置文件中.那么本博文主要 ...

  3. 《从零開始搭建游戏server》项目公布到Linux环境

    前言: 之前我们提及了怎样使用Maven来创建.管理和打包项目,也简单过了一遍Linux中搭建Java开发环境的步骤,如今我们就開始将我们之前开发的项目demo公布到Linux环境下.并让它正常执行起 ...

  4. maven 整合 ssm 异常分析

    异常一:使用tomcat 7 启动没问题访问(JSP)页面就报错:org.apache.jasper.JasperException: Unable to compile class for JSP ...

  5. GC的性能指标和内存容量配置原则

    一.GC性能指标吞吐量:应用花在非GC上的时间百分比GC负荷:与吞吐量相反,指应用花在GC上的时间百分比暂停时间:应用花在GC stop-the-world的时间GC频率反应速度:从一个对象变成垃圾到 ...

  6. struts2.3+spring3.2+hibernate4.2例子

    有些教程比较老,可是版本更新不等人,基于马士兵老师小例子,自己重新引用了新的包,调试确实有点烦人,但是通过英文文档和google解决问题.官网的更新超快,struts2.3+spring3.2+hib ...

  7. 20165324《Java程序设计》第二周

    20165324 <Java程序设计>第2周学习总结 教材学习内容总结 本周学习内容如下: 基本数据类型 整数类型:byte,shout,int,long. 字符类型:char. 浮点类型 ...

  8. Java设计原则—依赖倒置原则(转)

    依赖倒置原则(Dependence Inversion Principle,DIP)的原始定义: 高层模块不应该依赖底层模块,两者都应该依赖其抽象: 抽象不应该依赖细节: 细节应该依赖抽象. 依赖倒置 ...

  9. cisco anyconnect linux

    cisco anyconnect linux 官方的下载需要登录验证,比较麻烦,可以从这个地方直接下载使用.支持ubuntu,centos. cisco anyconnect vpn client我本 ...

  10. JavaScript常用算法

    一.排序算法 1.Array.sort(function)(JavaScript原生排序算法)参数:比较函数(可选)若无参数,则按照首字母的ASCII码排序,比较函数的作用为确定排序 function ...