Json实现异步请求(提交评论)

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

html代码:

<form id="form1" runat="server">
  <p>
    评论:</p>
  <p>
    姓名:<input type="text" name="username" id="username1" /></p>
  <p>
    内容:<textarea name="content" id="content" rows="2" cols="20"></textarea></p>
  <p>
    <input type="button" id="send" value="提交" /></p>
  </form>
  <div class="comment">
    已有评论:</div>
  <div id="resText">
  </div>

js代码:

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

插件代码:

<%@ WebHandler Language="C#" Class="doSave" %>

using System;
using System.Web;

public class doSave : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {

  var dic = new System.Collections.Generic.Dictionary<string, object>();    //存储的集合
  string jsonStr = "{}";		     //新建字符串jsonStr

  context.Response.ContentType = "text/json";	  //定义返回的内容类型为json

  string uname = context.Request.QueryString[0];       //获取请求参数中第一个参数,也可以直接使用uname

  string commet = context.Request.QueryString[1];      //定义字符串uname、commet为context请求查询的字符串context.Request.Params["username"];QyertStrubg:查询字符串

  dic.Add("username", uname);		      //将字符串添加到对象中

  dic.Add("content", commet);

  jsonStr = Newtonsoft.Json.JsonConvert.SerializeObject(dic);     //序列化集合为json字符串

  context.Response.Write(jsonStr);
    }

    public bool IsReusable
    {
  get
  {
      return false;
  }
    }

}

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

时间: 2024-10-11 01:27:22

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

SpringMVC环境下实现的Ajax异步请求(JSON格式数据)

一 环境搭建 首先是常规的spring mvc环境搭建,不用多说,需要注意的是,这里需要引入jackson相关jar包,然后在spring配置文件"springmvc-servlet.xml"中添加json解析相关配置,我这里的完整代码如下: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schem

IOS - 网络(HTTP请求、同步请求、异步请求、JSON解析数据)

1 // 2 // ViewController.m 3 // IOS_0129_HTTP请求 4 // 5 // Created by ma c on 16/1/29. 6 // Copyright © 2016年 博文科技. All rights reserved. 7 // 8 9 #import "ViewController.h" 10 #import "MBProgressHUD+MJ.h" 11 12 @interface ViewController

Jquery异步请求Action返回JSON

转载请注明出处:jiq?钦's technical Blog 最近在自己写分布式注册中心的Web管理界面,需要点击左边树节点时,请求后台Action查询该节点的详细数据,然后异步刷新右边的节点信息区域. 异步刷新用了Jquery对Ajax的封装: function zTreeOnClick(event, treeId, treeNode) { $.ajax({ type: "POST", url: "Config.action", data: ""

ajax json 异步请求

function ajaxTest(){ if (true) { $.ajaxSettings.async = false; var dataJson; $.getJSON("/universities", function(data) { dataJson = JSON.stringify(data); console.log("1>>>>>>>"); }); console.log("2>>>

Ajax异步请求一般处理程序(List)返回Json数据

简单实现了通过jQuery的Ajax函数异步请求一般处理程序,数据由list模拟,返回json格式的数据. index.html: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="js/jquery.min.js" type="text/javasc

通过jquery的ajax异步请求接收返回json数据

jquery的ajax异步请求接收返回json数据方法设置简单,一个是服务器处理程序是返回json数据,另一种就是ajax发送设置的datatype设置为jsonp格式数据或json格式都可以. 代码示例如下: $('#send').click(function () { $.ajax({ type : "GET", url : "a.php", dataType : "jsonp", success : function (data) { $.

【Spring学习笔记-MVC-5】利用spring MVC框架,实现ajax异步请求以及json数据的返回

作者:ssslinppp      时间:2015年5月26日 15:32:51 1. 摘要 本文讲解如何利用spring MVC框架,实现ajax异步请求以及json数据的返回. Spring MVC与json参考文章:[spring学习笔记-mvc-3]返回json数据-方式1  和 [spring学习笔记-mvc-4]返回json数据-方式2. 使用到的技术主要如下: Ajax:使用JQuery 提供的ajax:==>需要引入jquery.min.js文件: Spring MVC: Jso

异步请求取得json数据

一.异步请求 在之前我们请求数据的时候都是整个页面全部刷新了一次,也就是每次请求都会重新请求所有的资源.但是在很多时候不需要页面全部刷新,仅仅是需要页面的局部数据刷新即可,此时需要发送异步请求来实现这种局部数据刷新的要求,异步请求简称 Ajax(Asynchronous Javascript And XML),在之前一般使用js 发送异步请求,请求的数据一般是xml,但是现在 json 出现之后就不使用xml 做为数据传输格式标准了.使用jQuery 发送异步请求,jq中的异步请求发送有很多方式

异步请求(获取json数据)

异步请求 不使用异步请求的时候,请求数据都是整个页面全部刷新一次,这样每次请求都会重新请求所有的资源. 很多时候不需要页面全部刷新, 只需要页面的局部数据刷新即可, 此时就需要发送异步请求来实现局部数据刷新的请求 异步请求简称 Ajax (Asynchronous Javascript And XML) 以前 js 发送异步请求数据, 一般是xml, 现在是json了 Demo: 使用JQ发送 异步请求方式一html: <a href="javascript:void(0)"&g