jQuery post数据至ashx实例详解


Posted in Javascript onNovember 18, 2016
public void ProcessRequest(HttpContext context)
    {
      context.Response.ContentType = "application/json";
      context.Response.ContentEncoding = Encoding.UTF8;

      Stream inputStream = context.Request.InputStream;
      Encoding encoding = context.Request.ContentEncoding;
      StreamReader streamReader = new StreamReader(inputStream, encoding);

      string strJson = streamReader.ReadToEnd();

      Param p = JsonConvert.DeserializeObject<Param>(strJson);

      int top = Convert.ToInt32(p.Top);
      string term = p.Term;

      
      //var result = ...
      //context.Response.Write(result.ToJson());
    }

Source Code

jQuery post数据至ashx

今天给大家分享一个小功能,在jQuery环境中,Post data to ashx进行数据交互。

参考下面代码示例:
jQuery post数据至ashx实例详解

$.ajax({
           url: '<%= ResolveUrl("~/Handlers/xxx.ashx") %>',
              dataType: "json",
              type: "POST",
              contentType: "application/json; charset=utf-8",
              data: JSON.stringify({
                top: 10,
                term: request.term
              }),
              success: function (data) {
                //...
              }
            });

jQuery的Post值是使用type: "POST",上传的数据类型为contentType: "application/json; charset=utf-8"。

从代码示例中,它有2个参考需要上传,top,term。

为了更好在ashx能接收,我们写一个model:
jQuery post数据至ashx实例详解

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

/// <summary>
/// Summary description for Param
/// </summary>
namespace Insus.NET
{
  public class Param
  {
    private int _top;
    public int Top
    {
      get { return _top; }
      set { _top = value; }
    }


    private string _term;

    public string Term
    {
      get { return _term; }
      set { _term = value; }
    }
  }
}

在ashx处理程序中,我们可以同下面这样接收Post过来的数据:

jQuery post数据至ashx实例详解

下面我们尝试在实际环境中,Post一个数据如 “1628”,在FireFox的firebug看到传送结果如下:
jQuery post数据至ashx实例详解

在ashx中,接收到的结果如下:
jQuery post数据至ashx实例详解

 再进一步得到top的值:
jQuery post数据至ashx实例详解

最后得到的是term的值:
jQuery post数据至ashx实例详解

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

Javascript 相关文章推荐
一个刚完成的layout(拖动流畅,不受iframe影响)
Aug 17 Javascript
游览器中javascript的执行过程(图文)
May 20 Javascript
解析javascript 浏览器关闭事件
Jul 08 Javascript
js实现精确到秒的倒计时效果
May 29 Javascript
AngularJS入门教程之 XMLHttpRequest实例讲解
Jul 27 Javascript
概述BootStrap中role=&quot;form&quot;及role作用角色
Dec 08 Javascript
jQuery Position方法使用和兼容性
Aug 23 jQuery
bootstrap实现点击删除按钮弹出确认框的实例代码
Aug 16 Javascript
使用webpack构建应用的方法步骤
Mar 04 Javascript
详解JavaScript的数据类型以及数据类型的转换
Apr 20 Javascript
解决layui的radio属性或别的属性没显示出来的问题
Sep 26 Javascript
详解Vue3 Composition API中的提取和重用逻辑
Apr 29 Javascript
JS实现点击网页判断是否安装app并打开否则跳转app store
Nov 18 #Javascript
基于jQuery的checkbox全选问题分析
Nov 18 #Javascript
JavaScript动态数量的文件上传控件
Nov 18 #Javascript
JS识别浏览器类型(电脑浏览器和手机浏览器)
Nov 18 #Javascript
Node.js 实现简单小说爬虫实例
Nov 18 #Javascript
基于jQuery的select下拉框选择触发事件实例分析
Nov 18 #Javascript
jQuery实现隔行变色的方法分析(对比原生JS)
Nov 18 #Javascript
You might like
学习php过程中的一些注意点的总结
2013/10/25 PHP
YII Framework教程之异常处理详解
2016/03/14 PHP
PHP针对多用户实现更换头像功能
2016/09/04 PHP
PHPCMS手机站伪静态设置详细教程
2017/02/06 PHP
微信推送功能实现方式图文详解
2019/07/12 PHP
mouse_on_title.js
2006/08/25 Javascript
jquery动态加载图片数据练习代码
2011/08/04 Javascript
nodejs实现的一个简单聊天室功能分享
2014/12/06 NodeJs
vue+vuecli+webpack中使用mockjs模拟后端数据的示例
2017/10/24 Javascript
Vue页面骨架屏注入方法
2018/05/13 Javascript
使用Vue CLI创建typescript项目的方法
2019/08/09 Javascript
原生js实现随机点名功能
2019/11/05 Javascript
优化Vue中date format的性能详解
2020/01/13 Javascript
[39:46]完美世界DOTA2联赛PWL S2 LBZS vs Rebirth 第二场 11.25
2020/11/25 DOTA
[40:53]完美世界DOTA2联赛PWL S3 Magma vs DLG 第二场 12.18
2020/12/20 DOTA
python发送邮件接收邮件示例分享
2014/01/21 Python
简单说明Python中的装饰器的用法
2015/04/24 Python
用python标准库difflib比较两份文件的异同详解
2018/11/16 Python
Python学习笔记之Django创建第一个数据库模型的方法
2019/08/07 Python
python爬取百度贴吧前1000页内容(requests库面向对象思想实现)
2019/08/10 Python
python3 实现爬取TOP500的音乐信息并存储到mongoDB数据库中
2019/08/24 Python
浅谈numpy中np.array()与np.asarray的区别以及.tolist
2020/06/03 Python
pycharm 的Structure界面设置操作
2021/02/05 Python
HTML5 声明兼容IE的写法
2011/05/16 HTML / CSS
澳大利亚免息网上购物:Shop Zero
2016/09/17 全球购物
巴黎欧莱雅法国官网:L’Oreal Paris
2019/04/30 全球购物
为女性购买传统的印度服装和婚纱:Kalkifashion
2019/07/22 全球购物
法国在线药房:Shop Pharmacie
2019/11/26 全球购物
培训讲师邀请函
2014/01/10 职场文书
学校卫生检查制度
2014/02/03 职场文书
财务检查整改报告
2014/11/06 职场文书
2014年学生会工作总结
2014/11/07 职场文书
入党政审材料范文
2014/12/24 职场文书
校车安全管理责任书
2015/05/11 职场文书
2015年幼儿园学前班工作总结
2015/05/18 职场文书
小学五年级班主任工作经验交流材料
2015/11/02 职场文书