现在的位置: 首页 > 综合 > 正文

$.ajax方法(传递json数据)

2012年10月20日 ⁄ 综合 ⁄ 共 2569字 ⁄ 字号 小 中 大 ⁄ 评论关闭

前台

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" >
  3. <head>
  4.     <title>无标题页</title>
  5.     <style type="text/css">
  6.         .show{ display:block;}
  7.         .hide{ display:none;}
  8.     </style>
  9.     <script type="text/javascript" src="jquery/jquery-1.2.6.js"></script>
  10.     <script type="text/javascript">
  11.         
  12.         //这个方法把ajax方法封装一下，方便调用。
  13.         function myajax(){ 
  14.             //var obj=jsonData();
  15.             $.ajax({
  16.                 type:'post',
  17.                 url:'ajax.aspx',
  18.                 data:jsonData(),//可以直接加一个函数名。
  19.                 dataType:'json',
  20.                 beforeSend:beforecall,
  21.                 success:callback
  22.             });
  23.         }
  24.         //封装json数据，为了代码清晰
  25.         function jsonData(){
  26.             var jsonStr="({";
  27.             jsonStr+="/"name/":";
  28.             jsonStr+="/"tree/"";
  29.             jsonStr+=",";
  30.             jsonStr+="/"id/":";
  31.             jsonStr+="/"123/"";
  32.             jsonStr+="})";
  33.             return eval(jsonStr);//关键在于转换。
  34.         }
  35.         //调用前方法,不成功
  36.         function beforecall(){
  37.             $('#wait').addClass("show").append('调出中...');
  38.             //alert('');//测试是否调用
  39.         }
  40.         //回调函数
  41.         function callback(data){
  42.             $('#response').append(data.name+data.id);
  43.             $('#wait').css("display","none");
  44.         }
  45.         //onload()事件
  46.         $(function(){
  47.             $('#confirm').click(myajax);
  48.         })
  49.     </script>
  50. </head>
  51. <body>
  52.     <div id="confirm">点击</div>
  53.     <div id="response">接收后台数据</div>
  54.     <div id="wait" class="hide">hello</div>
  55. </body>
  56. </html>

后台

  1.     protected void Page_Load(object sender, EventArgs e)
  2.     {
  3.         Hashtable ht = new Hashtable();
  5.         string name = Request.Params["name"].ToString();
  6.         string birth = Request.Params["birthday"].ToString();
  7.         if (!string.IsNullOrEmpty(name) && !string.IsNullOrEmpty(birth))
  8.         {
  9.             //Response.ContentType = "Application/json";
  10.             //Response.Write(CreareJson("this is ok!", 1, name, birth));
  11.             ht.Add("info", "成功了");
  12.             ht.Add("sta", "状态");
  13.             ht.Add("name", name);
  14.             ht.Add("birth", birth);
  15.             Response.Write(CreateJsonParams(ht));
  16.         }
  17.         Response.End();
  18.     }
  19.     private string CreateJsonParams(Hashtable items)
  20.     {
  21.         string returnStr = "";
  22.         foreach(DictionaryEntry item in items)
  23.         {
  24.             returnStr += "/"" + item.Key.ToString() + "/":/"" + item.Value.ToString() + "/",";
  25.         }
  26.         return "{" + returnStr.Substring(0,returnStr.Length-1) + "}";
  27.     }
返回
【上篇】
【下篇】

作者:

抱歉!评论已关闭.

返回首页

Copyright © 2013-2018 学步园  保留所有权利.
软文销售 QQ客服：2265327166 点击这里给我发消息（其他合作也可洽谈）
必威体育
必威电竞