案例讲解asp.net中jquery post的用法

页面导航:首页 > 网络编程 > JavaScript > 案例讲解asp.net中jquery post的用法

案例讲解asp.net中jquery post的用法

来源: 作者: 时间:2016-02-04 09:15 【

一、post案例:1 前台default aspx: body{font-size:13px} divFrame{width:260px;border:solid 1px 666} divFrame divTitle{paddi

一、post案例:

1.前台default.x:

 



<script type=text/javascript
src=Jscript/jquery-1.4.2-vsdoc.js>
</script><script type=text/javascript
src=Jscript/jquery-1.4.2.js>
</script>

    <script type=text/javascript>
    $(function() {
            $(#Button1).click(function() { //按钮单击事件
                //打开文件,并通过回调函数返回服务器响应后的数据
                $.post(Handler.ashx,
                { name: encodeURI($(#txtName).val()),
                   sex: encodeURI($(#selSex).val())
                },
                function(data) {
                    $(#divTip)
                    .empty() //先清空标记中的内容
                    .(data); //显示服务器返回的数据
                })
            })
        })
    </script>

姓名:
 
2.后台handler.ashx

 

 

<%@ webhandler="" language="C#" class="Handler">

using System;
using System.Web;

public class Handler : IHttpHandler {
    
    public void ProcessRequest (HttpContext context) {
        //context.Response.ContentType = text/plain;
        //context.Response.Write(Hello World); 
<%@ webhandler="" language="C#" class="Handler">
        string strName = System.Web.HttpUtility.UrlDecode(context.Request[name]);//解码姓名字符
        string strSex = System.Web.HttpUtility.UrlDecode(context.Request[sex]);//解码性别字符
        string strHTML = 
; //初始化保存内容变量 if (strName == 陶国荣 && strSex == ) { strHTML += 姓名:陶国荣
; strHTML += 性别:男
; strHTML += 邮箱:
; } else if (strName == 李建洲 && strSex == ) { strHTML += 姓名:李建洲
; strHTML += 性别:女
; strHTML += 邮箱:
; } strHTML +=
; context.Response.Write(strHTML); //context.Response.Write(return);//如直接返回字符,前台function中的data则为纯字符串“return” } public bool IsReusable { get { return false; } } }
3.说明:
1.传递的参数中的
name和对应的参数值encodeURI($(#txtName).val()),在函数中即可以表示为{name:encodeURI($(#txtName).val()),}

形式,也可以加对双方加单引号,ashx文件都可以得到参数值

2.encodeURI($(#txtName).val())是对遇到汉字的处理形式,相应的后台需要使用System.Web.HttpUtility.UrlDecode(Request[name])来进行汉字解码

3.后台尽量使用ashx文件响应,会使得的页面相应速度加快

4.如直接使用context.Response.Write(return),前台function中的data将得到纯字符串“return”(不含html)

 

4.结果如图:

另外附加使用服务器控件的案例:

1.前台

 

<%@ page="" language="C#" autoeventwireup="true" codefile="Default.aspx.cs" inherits="_Default">



   
    <script type=text/javascript              src=Jscript/jquery-1.4.2-vsdoc.js>     </script>    <script type=text/javascript              src=Jscript/jquery-1.4.2.js>     </script>        <script type=text/javascript>         $(function () {             $(#Button1).click(function () { //按钮单击事件                 //打开文件,并通过回调函数返回服务器响应后的数据                 $.post(Handler.ashx,                 {
                    name: $(input[id*=txtName]).val(),
                    sex: $(#selSex).val()
                },
                function (data) {
                    $(#divTip)
                    .empty() //先清空标记中的内容
                    .html(data); //显示服务器返回的数据
                })
            })
        })
    </script>
   
         
              姓名:
<%@ page="" language="C#" autoeventwireup="true" codefile="Default.aspx.cs" inherits="_Default">
           
             

; } else if (strName == 李建洲 && strSex == 女) { strHTML += 姓名:李建洲
; strHTML += 性别:女
; strHTML += 邮箱:
; } strHTML +=
; context.Response.Write(strHTML); //context.Response.Write(return); } public bool IsReusable { get { return false; } } }

结果显示:

\

 

 

 

Tags:

文章评论

最 近 更 新
热 点 排 行
Js与CSS工具
代码转换工具

<