jQuery AJAX 调用WebService实现代码


Posted in Javascript onMarch 24, 2010

用jQuery调用其他项目的WebService
实现登录验证功能
html输入用户名密码:
代码

<table style="width: 400px"> 
<tr> 
<td style="width: 200px" class="left"> 
Login ID: 
</td> 
<td style="width: 200px" class="left"> 
<input id="txtLoginID" type="text" style="width: 190px;" value="" /> 
</td> 
</tr> 
<tr> 
<td style="width: 200px" class="left"> 
Login Password: 
</td> 
<td style="width: 200px" class="left"> 
<input id="txtLoginPW" type="password" style="width: 190px;" value="" /> 
</td> 
</tr> 
<tr> 
<td style="width: 200px" class="center"> 
<input id="btnSignin" value="Sign in" class="button" readonly /> 
</td> 
<td style="width: 200px" class="center"> 
<input id="btnSignup" value="Sign up" class="button" readonly /> 
</td> 
</tr> 
</table>

Jquery引用和登录事件
代码
<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script> 
<script type="text/javascript" language="javascript"> 
$(document).ready(function() 
{ 

$('#btnSignin').click 


(function() 


{ 



$.ajax 



( 



{ 




type: "POST",  




contentType: "application/json", 




url: serviceURL+"/UserLogin", 




data: "{UserLoginID:'"+$('#txtLoginID').val()+"',UserLoginPW:'"+$('#txtLoginPW').val()+"'}",

   




dataType: 'json', 




success: function(result) 




{ 




 var user = eval(result.d); 





location.href = "Welcome.aspx?userID="+user.UserID 



  }, 



  error: function(result, status) 



  { 



  if(status == 'timeout') 



  { 



  alert("The request timed out, please resubmit"); 



  } 



  else 



  { 



  if(result.responseText !="") 



  { 



  eval("exception = "+result.responseText); 






 alert(exception.Message); 






} 





} 




} 



} 



); 


} 


); 
  }); 
  
  $(document).ready(function() 
{ 


$('#btnSignup').click 


(function() 


{ 



location.href = "Signup/Signup.aspx"; 


}) 
 
  }); 
</script>

serviceURL类似:var serviceURL = "http://localhost:1742/SoldierServices.asmx";
WebService代码:
代码
/// <summary> 
/// Summary description for SoldierServices 
/// </summary> 
[WebService(Namespace = "http://tempuri.org/")] 
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 
[ToolboxItem(false)] 
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
[System.Web.Script.Services.ScriptService] 
public class SoldierServices : System.Web.Services.WebService 
{ 
[WebMethod] 
public User UserLogin(string UserLoginID, string UserLoginPW) 
{ 
LoginBusiness lb = new LoginBusiness(); 
return lb.UserLogin(UserLoginID, UserLoginPW); 
} 
[WebMethod] 
public User GetUserInfo(string UserID) 
{ 
LoginBusiness lb = new LoginBusiness(); 
return lb.GetUserInfo(UserID); 
} 
}

注意:[System.Web.Script.Services.ScriptService]默认是注释的,要把注释去掉
Javascript 相关文章推荐
event.srcElement+表格应用
Aug 29 Javascript
js刷新框架子页面的七种方法代码
Nov 20 Javascript
jQuery判断div随滚动条滚动到一定位置后停止
Apr 02 Javascript
javascript中为某个元素指定事件的三种方式
Aug 07 Javascript
js实现a标签超链接提交form表单的方法
Jun 24 Javascript
JS获取地址栏参数的两种方法(简单实用)
Jun 14 Javascript
Angular2学习笔记——详解NgModule模块
Dec 02 Javascript
js cookie实现记住密码功能
Jan 17 Javascript
bootstrap插件treeview实现全选父节点下所有子节点和反选功能
Jul 21 Javascript
Vue自定义全局Toast和Loading的实例详解
Apr 18 Javascript
vue使用codemirror的两种用法
Aug 27 Javascript
Vue 自定义指令实现一键 Copy功能
Sep 16 Javascript
jquery 仿QQ校友的DIV模拟窗口效果源码
Mar 24 #Javascript
Javascript中Eval函数的使用
Mar 23 #Javascript
JavaScript Eval 函数使用
Mar 23 #Javascript
js本身的局限性 别让javascript做太多事
Mar 23 #Javascript
js parentElement和offsetParent之间的区别
Mar 23 #Javascript
Javascript 变量作用域 两个可能会被忽略的小特性
Mar 23 #Javascript
JavaScript Perfection kill 测试及答案
Mar 23 #Javascript
You might like
法国:浪漫之都的咖啡文化
2021/03/03 咖啡文化
php radio 单选框获取与保持值的实现代码
2010/05/15 PHP
smarty中js的调用方法示例
2014/10/27 PHP
CI框架常用函数封装实例
2016/11/21 PHP
PHP封装的数据库模型Model类完整示例【基于PDO】
2019/03/14 PHP
深入理解JS中的变量及作用域、undefined与null
2014/03/04 Javascript
JQuery 控制内容长度超出规定长度显示省略号
2014/05/23 Javascript
分享20个提升网站界面体验的jQuery插件
2014/12/15 Javascript
js去字符串前后空格的实现方法
2016/02/26 Javascript
javascript实现下雪效果【实例代码】
2016/05/03 Javascript
jQuery过滤特殊字符及JS字符串转为数字
2016/05/26 Javascript
基于jQuery实现表格的排序
2016/12/02 Javascript
javascript设计模式之中介者模式学习笔记
2017/02/15 Javascript
Ajax基础知识详解
2017/02/17 Javascript
nodejs+websocket实时聊天系统改进版
2017/05/18 NodeJs
详解各版本React路由的跳转的方法
2018/05/10 Javascript
使用 webpack 插件自动生成 vue 路由文件的方法
2019/08/20 Javascript
es6 super关键字的理解与应用实例分析
2020/02/15 Javascript
vue-video-player 解决微信自动全屏播放问题(横竖屏导致样式错乱问题)
2020/02/25 Javascript
解决vue net :ERR_CONNECTION_REFUSED报错问题
2020/08/13 Javascript
Python中的hypot()方法使用简介
2015/05/18 Python
基于进程内通讯的python聊天室实现方法
2015/06/28 Python
Python实例一个类背后发生了什么
2016/02/09 Python
200行python代码实现2048游戏
2019/07/17 Python
django admin后管定制-显示字段的实例
2020/03/11 Python
python使用dlib进行人脸检测和关键点的示例
2020/12/05 Python
Html5移动端弹幕动画实现示例代码
2018/08/27 HTML / CSS
LINUX下线程,GDI类的解释
2016/12/14 面试题
翻译学院毕业生自荐书
2014/02/02 职场文书
合作经营协议书
2014/04/17 职场文书
向雷锋同志学习倡议书
2015/04/27 职场文书
高一军训感想
2015/08/07 职场文书
python 实现德洛内三角剖分的操作
2021/04/22 Python
Java面试题冲刺第十九天--数据库(4)
2021/08/07 Java/Android
vue使用refs获取嵌套组件中的值过程
2022/03/31 Vue.js
MySQL创建管理HASH分区
2022/04/13 MySQL