• jquery 的 ajax 程序 简单的


    了解ajax, json,ashx,例子是一个当你用户名输入用户名,请求页面进行比对处理 例子很简单但是让初学者可以更好的理解query中的ajax
    Javascript:
    Javascript代码 
    1. <script src="js/jquery-1.4.2.js" type="text/javascript"></script>  
    2. <script type="text/javascript">  
    3. function alertMsg()  
    4. {  
    5.     var user={"id":"","pwd":""};  
    6.     user.id= $("input:text").val();  
    7.     user.pwd=$("input:password").val();          
    8.     $.ajax({  
    9.             url: "HandleAjax.ashx",//这里的请求页面建议大家使用ashx 一般处理程序 相当于一个轻量级的aspx 这里的对数据的处理没有必要那么大费周折的使用aspx,也算是对性能做了一点点小贡献吧  
    10.                 data: "user="+user.id,  
    11.                 datatype: "json",//请求页面返回的数据类型  
    12.                 type: "GET",  
    13.                 contentType: "application/json",//注意请求页面的contentType 要于此处保持一致  
    14.                 success:function(data) {//这里的data是由请求页面返回的数据  
    15.                     alert(data.result);  
    16.                 },  
    17.                 error: function(XMLHttpRequest, textStatus, errorThrown) {  
    18.                     alert("XMLHttpRequest");  
    19.                     }  
    20.             });  
    21.   
    22. }  
        <script src="js/jquery-1.4.2.js" type="text/javascript"></script>     <script type="text/javascript">     function alertMsg()     {         var user={"id":"","pwd":""};         user.id= $("input:text").val();         user.pwd=$("input:password").val();                 $.ajax({                 url: "HandleAjax.ashx",//这里的请求页面建议大家使用ashx 一般处理程序 相当于一个轻量级的aspx 这里的对数据的处理没有必要那么大费周折的使用aspx,也算是对性能做了一点点小贡献吧                     data: "user="+user.id,                     datatype: "json",//请求页面返回的数据类型                     type: "GET",                     contentType: "application/json",//注意请求页面的contentType 要于此处保持一致                     success:function(data) {//这里的data是由请求页面返回的数据                         alert(data.result);                     },                     error: function(XMLHttpRequest, textStatus, errorThrown) {                         alert("XMLHttpRequest");                         }                 });      } 

    Html:
    Html代码 
    1. <body>  
    2.     用户名:<input id="id" type="text" name="id" />  
    3.     密码:<input id="pwd" type="password" name="pwd" />  
    4.       
    5.   
    6.     <input id="submit" type="button" name="sub" value="submit" onclick="alertMsg();" />  
    7. </body>  
    <body>     用户名:<input id="id" type="text" name="id" />     密码:<input id="pwd" type="password" name="pwd" />           <input id="submit" type="button" name="sub" value="submit" onclick="alertMsg();" /> </body> 

    请求页面 ashx
    C#代码 
    1. <%@ WebHandler Language="C#" Class="HandleAjax" %>  
    2.   
    3. using System;  
    4. using System.Web;  
    5.   
    6. public class HandleAjax : IHttpHandler {  
    7.       
    8.     public void ProcessRequest (HttpContext context) {  
    9.         context.Response.ContentType = "application/json";  
    10.         if (context.Request["user"] == "jiayou")  
    11.         {  
    12.             string hello="OK";  
    13.             context.Response.Write("{\"result\":\""+hello+"\"}");//注意格式”key”:”value” 这里的格式我写错了好几次才改正确的  
    14.         }  
    15.         else { context.Response.Write("{\"result\":\"Hello pig\""); }  
    16.     }  
    17.    
    18.     public bool IsReusable {  
    19.         get {  
    20.             return false;  
    21.         }  
    22.     }  
    23. }
  • 相关阅读:
    Atitit RSA非对称加密原理与解决方案
    Atitit RSA非对称加密原理与解决方案
    atitit.错误:找不到或无法加载主类 的解决 v4 qa15.doc
    atitit.错误:找不到或无法加载主类 的解决 v4 qa15.doc
    Mac设置su root密码
    Window系统命令行调用控制面板程序
    Ubuntu 安装最新版nodejs
    python中time.strftime不支持中文,报错UnicodeEncodeError: 'locale' codec can't encode character 'u5e74' in position 2: encoding error
    字节跳动——IT技术工程师面试题
    HTTP状态码
  • 原文地址:https://www.cnblogs.com/weixing/p/2100076.html
Copyright © 2020-2023  润新知