[JQ权威指南]使用全局函数post()向服务器请求数据

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/david_520042/article/details/51908938

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>$.post发送请求</title>
    <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>
    <style type="text/css">
           body{font-size:13px}
           .divFrame{width:260px;border:solid 1px #666}
           .divFrame .divTitle{padding:5px;background-color:#eee;height:23px}
           .divFrame .divTitle span{float:left;padding:2px}
           .divFrame .divContent{padding:8px}
           .divFrame .divContent .clsShow{font-size:14px}
           select,input{float:left}
           .txt{border:#666 1px solid;padding:2px;width:80px;margin-right:3px}
           .btn {border:#666 1px solid;padding:2px;width:50px;
           filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffff, EndColorStr=#ECE9D8);}
    </style>
    <script type="text/javascript">
        $(function() {
            $("#Button1").click(function() { //按钮单击事件
                //打开文件,并通过回调函数返回服务器响应后的数据
                $.post("User_Info.aspx",
                { name: encodeURI($("#txtName").val()),
                   sex: encodeURI($("#selSex").val())
                },
                function(data) {
                    $("#divTip")
                    .empty() //先清空标记中的内容
                    .html(data); //显示服务器返回的数据
                })
            })
        })
    </script>
</head>
<body>
   <div class="divFrame">
         <div class="divTitle">
              <span>姓名:</span>
              <input id="txtName" type="text" class="txt" />
              <select id="selSex" style="height:22px;margin-right:3px">
                 <option value="">选性别</option>
                 <option value="男"></option>
                 <option value="女"></option>
              </select>
              <input id="Button1" type="button" 
                     class="btn" value="请求" />
         </div>
         <div class="divContent">
              <div id="divTip"></div>
         </div>
    </div>
</body>
</html>

User_Info.aspx

<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="gb2312" %>
<% 
    string strName = System.Web.HttpUtility.UrlDecode(Request["name"]);//解码姓名字符
    string strSex = System.Web.HttpUtility.UrlDecode(Request["sex"]);//解码性别字符
    string strHTML = "<div class='clsShow'>"; //初始化保存内容变量
    if (strName == "龚德辉" && strSex=="男")
    {
        strHTML += "姓名:龚德辉<br>";
        strHTML += "性别:男<br>";
        strHTML += "邮箱:258365567@qq.com<hr>";
    }
    else if (strName == "李建洲" && strSex == "女")
    {
        strHTML += "姓名:李建洲<br>";
        strHTML += "性别:女<br>";
        strHTML += "邮箱:xiaoli@163.com<hr>";
    }
    strHTML += "</div>";
    Response.Write(strHTML);
%>

没有更多推荐了,返回首页