JQuery Ajax WebService传递参数的简单实例


Posted in Javascript onNovember 02, 2016

Asp.NET中利用jQuery实现Ajax时,在服务器端可以使用aspx,ashx,以及WebService等方式。最近研究了一下WebService方式,jQuery Ajax 方法调用 jQuery Ajax方法调用 Asp.Net WebService 的详细实例代码这篇帖子给出了很详细的例子,不过没有给出详细解释。其中有几个细节问题开始没注意,费老劲才调通:

1)客户端data数据中的key字段名称必须和服务器端方法参数严格一致。

如客户端:

//有参数调用
    $(document).ready(function () {
      $("#btn2").click(function () {
        $.ajax({
          type: "POST",
          contentType: "application/json",
          url: "WebService.asmx/GetWish",
          data: "{value1:'心想事成',value2:'万事如意',value3:'牛牛牛',value4:2009}",
          dataType: 'json',
          success: function (result) {
            $('#dictionary').append(result.d);
          }
        });
      });
    });

服务器端的GetWish函数参数必须写成value1,value2,value3,value4:

[WebMethod]
  public string GetWish(string value1, string value2, string value3, int value4)
  {
    return string.Format("祝您在{3}年里 {0}、{1}、{2}", value1, value2, value3, value4);
  }

2)客户端传递对象到服务器端的方法:

客户端代码:

//传入对象
    $(function () {
      $("#btn6").click(function () {
        obj = new Object();
        obj.ID = "1";
        obj.Value = "aaa";
        //'{"obj":{"ID":"1",Value:"Horse"}}'
        var d = '{"obj":' + JSON.stringify(obj) + '}';
        $.ajax({
          type: "POST",  //访问WebService使用Post方式请求
          contentType: "application/json", //WebService 会返回Json类型
          url: "WebService.asmx/ParmsObject", //调用WebService的地址和方法名称组合 ---- WsURL/方法名
          data: d,     //这里是要传递的参数,格式为 data: "{paraName:paraValue}",下面将会看到    
          dataType: 'json',
          success: function (result) {
            alert(result.d);
          },
          error: function (result) {
            alert("fail");
          }
        });
      });

    });

服务器端代码:

[WebMethod]
  public string ParmsObject(Class1 obj)
  {

    return obj.ID + ":" + obj.Value;
  }

调试环境:VS2010+jquery-1.3.2.min.js

以上就是小编为大家带来的JQuery Ajax WebService传递参数的简单实例全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
JavaScript 学习笔记(七)字符串的连接
Dec 31 Javascript
JavaScript对象之间的转换 jQuery对象和原声DOM
Mar 07 Javascript
多个checkbox被选中时如何判断是否有自己想要的
Sep 22 Javascript
使用Bootstrap typeahead插件实现搜索框自动补全的方法
Jul 07 Javascript
jQuery实现可拖拽的许愿墙效果【附demo源码下载】
Sep 14 Javascript
JS定时器用法分析【时钟与菜单中的应用】
Dec 21 Javascript
React中使用UEditor百度富文本的方法
Aug 22 Javascript
小程序实现录音上传功能
Nov 22 Javascript
vue开发移动端底部导航条功能
Apr 08 Javascript
Vue实现图片轮播组件思路及实例解析
May 11 Javascript
Jquery ajax书写方法代码实例解析
Jun 12 jQuery
js对象属性名驼峰式转下划线的实例代码
Sep 17 Javascript
ASP.NET jquery ajax传递参数的实例
Nov 02 #Javascript
Javascript 正则表达式校验数字的简单实例
Nov 02 #Javascript
在JSP中如何实现MD5加密的方法
Nov 02 #Javascript
AngularJS入门教程之过滤器用法示例
Nov 02 #Javascript
JavaScript基础——使用Canvas绘图
Nov 02 #Javascript
js实现砖头在页面拖拉效果
Nov 20 #Javascript
AngularJS入门教程之模块化操作用法示例
Nov 02 #Javascript
You might like
用PHP实现Ftp用户的在线管理的代码
2007/03/06 PHP
PHP面向对象——访问修饰符介绍
2012/11/08 PHP
php获取当前时间的毫秒数的方法
2014/01/26 PHP
codeigniter集成ucenter1.6双向通信的解决办法
2014/06/12 PHP
docker-compose部署php项目实例详解
2019/07/30 PHP
WordPress免插件实现面包屑导航的示例代码
2020/08/20 PHP
jQuery lazyload 的重复加载错误以及修复方法
2010/11/19 Javascript
动态改变div的z-index属性的简单实例
2013/08/08 Javascript
Javascript基础教程之数据类型 (字符串 String)
2015/01/18 Javascript
JavaScript数组的一些奇葩行为
2016/01/25 Javascript
Bootstrap入门书籍之(五)导航条、分页导航
2016/02/17 Javascript
js表单登陆验证示例
2016/10/19 Javascript
JS实现全屏的四种写法
2016/12/30 Javascript
javascript判断回文数详解及实现代码
2017/02/03 Javascript
react路由配置方式详解
2017/08/07 Javascript
angularjs路由传值$routeParams详解
2020/09/05 Javascript
vuex根据不同的用户权限展示不同的路由列表功能
2019/09/20 Javascript
基于JavaScript或jQuery实现网站夜间/高亮模式
2020/05/30 jQuery
JavaScript中EventBus实现对象之间通信
2020/10/18 Javascript
[01:02:46]VGJ.S vs NB 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
详解Python中的静态方法与类成员方法
2017/02/28 Python
python实现数据写入excel表格
2018/03/25 Python
python DataFrame获取行数、列数、索引及第几行第几列的值方法
2018/04/08 Python
关于Pycharm无法debug问题的总结
2019/01/19 Python
详解python selenium 爬取网易云音乐歌单名
2019/03/28 Python
Python split() 函数拆分字符串将字符串转化为列的方法
2019/07/16 Python
解决Django中checkbox复选框的传值问题
2020/03/31 Python
python上selenium的弹框操作实现
2020/07/13 Python
介绍下WebSphere的安全性
2013/01/31 面试题
空指针到底是什么
2012/08/07 面试题
丑小鸭教学反思
2014/02/03 职场文书
推普周活动总结
2014/08/28 职场文书
党政领导班子群众路线对照检查材料思想汇报
2014/09/27 职场文书
基层党组织整改方案
2014/10/25 职场文书
幼儿园教师岗位职责
2015/04/02 职场文书
2016年情人节广告语
2016/01/28 职场文书