主要将代码粘贴,通过阅读代码理解当中的相关逻辑。

html代码:

  1. <form id="form1" runat="server">
  2. <p>
  3. 评论:</p>
  4. <p>
  5. 姓名:<input type="text" name="username" id="username1" /></p>
  6. <p>
  7. 内容:<textarea name="content" id="content" rows="2" cols="20"></textarea></p>
  8. <p>
  9. <input type="button" id="send" value="提交" /></p>
  10. </form>
  11. <div class="comment">
  12. 已有评论:</div>
  13. <div id="resText">
  14. </div>

js代码:

  1. $("#send").click(function () {
  2. $.get("doSave.ashx", {<span style="white-space:pre"> </span> <span style="font-family: Arial, Helvetica, sans-serif;"> </span>//调用json插件
  3. u_name: $("#username1").val(), //json数据/值对化
  4. u_cont: $("#content").val()
  5. }, function (data)
  6. var uName = data.username; //注:此处的username与doSave.ashx中的dic.add("username",uname)中的username相相应的
  7. var uCont = data.content;
  8. var txtHtml = "<div class='comment'><h6>"
  9. + uName + ":</h6><p class='para'>"
  10. + uCont + "</p></div>"
  11. $("#resText").html(txtHtml); //将返回的数据加入到页面上
  12. }, "json");
  13. })

插件代码:

  1. <%@ WebHandler Language="C#" Class="doSave" %>
  2.  
  3. using System;
  4. using System.Web;
  5.  
  6. public class doSave : IHttpHandler
  7. {
  8.  
  9. public void ProcessRequest(HttpContext context)
  10. {
  11.  
  12. var dic = new System.Collections.Generic.Dictionary<string, object>(); //存储的集合
  13. string jsonStr = "{}"; //新建字符串jsonStr
  14.  
  15. context.Response.ContentType = "text/json"; //定义返回的内容类型为json
  16.  
  17. string uname = context.Request.QueryString[0]; //获取请求參数中第一个參数,也能够直接使用uname
  18.  
  19. string commet = context.Request.QueryString[1]; //定义字符串uname、commet为context请求查询的字符串context.Request.Params["username"];QyertStrubg:查询字符串
  20.  
  21. dic.Add("username", uname); //将字符串加入到对象中
  22.  
  23. dic.Add("content", commet);
  24.  
  25. jsonStr = Newtonsoft.Json.JsonConvert.SerializeObject(dic); //序列化集合为json字符串
  26.  
  27. context.Response.Write(jsonStr);
  28. }
  29.  
  30. public bool IsReusable
  31. {
  32. get
  33. {
  34. return false;
  35. }
  36. }
  37.  
  38. }

此处效果即为,在输入框中输入相关文字,点击提交,下方会自己主动将书写的文字进行展示,无需跳转其它页面。

Json实现异步请求(提交评论)的更多相关文章

  1. 同步请求与异步请求Json

    同步请求的返回值类型 : void : 啥也不返回 String :表示逻辑视图名 ModelAndView:该对象既有逻辑视图名,还可以携带去页面要展示的数据 同步请求:如何将controller层 ...

  2. Ajax异步请求struts的JSON机制(省市区三级联动)

    1.struts.xml <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE struts P ...

  3. python爬虫(3)——用户和IP代理池、抓包分析、异步请求数据、腾讯视频评论爬虫

    用户代理池 用户代理池就是将不同的用户代理组建成为一个池子,随后随机调用. 作用:每次访问代表使用的浏览器不一样 import urllib.request import re import rand ...

  4. 【转载】LR提交JSON格式的请求

    需求: 测试一个“修改用户铜板”的接口,这个接口接收JSON格式的请求,返回JSON格式的结果: 必须用PUT方式提交请求: 提交内容:  {"method":"modi ...

  5. jquery的ajax异步请求接收返回json数据

    http://www.jb51.net/article/51122.htm jquery的ajax异步请求接收返回json数据方法设置简单,一个是服务器处理程序是返回json数据,另一种就是ajax发 ...

  6. ASIHTTPRequest异步请求 分类: ios技术 2015-03-01 09:33 48人阅读 评论(0) 收藏

    我们运行程序,如果网速很慢,查询的时候会一直黑屏,直到请求结束画面才出现,这样用户体验很不好.因此同步请求一般只是在某个子线 程中使用,而不在主线程中使用.异步请求的用户体验要比同步请求好,因此一般情 ...

  7. JSON(四)——异步请求中前后端使用Json格式的数据进行交互

    json格式的数据广泛应用于异步请求中前后端的数据交互,本文主要介绍几种使用场景和使用方法. 一,json格式字符串 <input type="button" id=&quo ...

  8. 异步请求取得json数据

    一.异步请求 在之前我们请求数据的时候都是整个页面全部刷新了一次,也就是每次请求都会重新请求所有的资源.但是在很多时候不需要页面全部刷新,仅仅是需要页面的局部数据刷新即可,此时需要发送异步请求来实现这 ...

  9. 异步请求Ajax(取得json数据)

    异步请求Ajax 没有学习Ajax之前请求数据的时候都是整个页面全部刷新了一次,也就是每次请求都会重新请求所有的资源.但是在很多时候不需要页面全部刷新,仅仅是需要页面的局部数据刷新即可,此时需要发送异 ...

随机推荐

  1. django 常见过滤器

      一.形式:小写 {{ name | lower }} 二.过滤器是可以嵌套的,字符串经过三个过滤器,第一个过滤器转换为小写,第二个过滤器输出首字母,第三个过滤器将首字母转换成大写 标签 {{ st ...

  2. GT使用说明

    GT文档:https://gt.qq.com/docs.html GT Android版的详细使用手册: https://gt.qq.com/docs/a/GTAndroidUserGuide.pdf

  3. Android几秒后自动关闭dialog

    代码改变世界 Android几秒后自动关闭dialog AlertDialog.Builder builder = new AlertDialog.Builder(v.getContext()); b ...

  4. jQuery中文文档

    http://www.jquery123.com/ http://www.shifone.cc/

  5. 持续集成---jenkins环境部署

    一.环境准备 操作系统:linux系统,此时我安装的是centos6.5,操作步骤具体见博客<虚拟机安装centos6.5> 依赖软件:1.jdk, 2.tomcat9(需要安装两个,一个 ...

  6. 刷题总结——卡牌配对(bzoj4205网络流)

    题目: Description 现在有一种卡牌游戏,每张卡牌上有三个属性值:A,B,C.把卡牌分为X,Y两类,分别有n1,n2张. 两张卡牌能够配对,当且仅当,存在至多一项属性值使得两张卡牌该项属性值 ...

  7. 【CCF】交通规划 Dijstra变形 优先级队列重载

    [题意] 给定一个无向图,求这个图满足所有点到顶点的最短路径不变的最小生成树 [AC] 注意双向边要开2*maxm 注意优先级队列 参考https://www.cnblogs.com/cielosun ...

  8. gcc/g++ 编译时出现:“对’xxxx’未定义的引用,collect2: error: ld returned 1 exit status” 的错误

    出现的问题: 在使用 make 编译实现一个程序时,出现了下面的错误.查看程序源文件所在的目录时发现程序已经完成了编译,并生成了 list_repo.o 的文件,说明是在程序链接生成可执行文件时发生了 ...

  9. cf287E Main Sequence

    As you know, Vova has recently become a new shaman in the city of Ultima Thule. So, he has received ...

  10. Redis集群模式配置

    redis集群部署安装: https://blog.csdn.net/huwh_/article/details/79242625 https://www.cnblogs.com/mafly/p/re ...