zoukankan      html  css  js  c++  java
  • Ajax使用Post方式提交到.aspx页面交互的例子

    有时间调试了Ajax使用Post方式提交到.aspx页面交互的过程,下面是例子:
    /**********************************客户端代码*****************************************************************/
    1、使用XMLHttpRequest直接post到.aspx页面
    <!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>无标题页</title>

        
    <script type="text/javascript">
                
    //创建XMLHttpRequest对象
                function getXMLhttpRequest(){
                    
    var xmlhttp;
                    
    if (window.XMLHttpRequest) {
                        xmlhttp 
    = new XMLHttpRequest();
                        
    if (xmlhttp.overrideMimeType) {
                            xmlhttp.overrideMimeType(
    "text/xml");
                        }

                    }

                    
    else 
                        
    if (window.ActiveXObject) {
                            
    var activeName = ["MSXML2.XMLHTTP""Microsoft.XMLHTTP"];
                            
    for (var i = 0; i < activeName.length; i++{
                                
    try {
                                    xmlhttp 
    = new ActiveXObject(activeName[i]);
                                    
    break;
                                }
     
                                
    catch (e) {
                                
                                }

                            }

                            
                        }

                    
    return xmlhttp;
                }

                
    var xmlhttp;
                
    function postClick(){
                    
    //定义发送字符串
                    //var xmldoc="<?xml version='1.0' encoding='utf-8' ?><UserInfo><User><UserName>小李</UserName><UserSex>男</UserSex><UserTel>123</UserTel><UserEmail>fdsfds@126.com</UserEmail></User><User><UserName>小林</UserName><UserSex>男</UserSex><UserTel>145</UserTel><UserEmail>xiaolin@126.com</UserEmail></User></UserInfo>";
                    //var xmldoc="fdsf";
                    var xml="<?xml version=\"1.0\" encoding=\"utf-8\" ?><UserInfo><User><UserName>小李</UserName><UserSex>男</UserSex><UserTel>123</UserTel><UserEmail>fdsfds@126.com</UserEmail></User><User><UserName>小林</UserName><UserSex>男</UserSex><UserTel>145</UserTel><UserEmail>xiaolin@126.com</UserEmail></User></UserInfo>";
                    
    var xmldoc=new ActiveXObject("MSXML2.DOMDocument");
                    xmldoc.loadXML(xml);
                    
    //创建XMLHttpRequest对象
                    xmlhttp = getXMLhttpRequest();
                    
    //初始化
                    //xmlhttp.open("POST", "PostHandler.ashx", true);//发送给.ashx数据可以被接收到
                    xmlhttp.open("POST""jQueryPostServer.aspx"true);//此处直接发送到.aspx去接收

                    
    //设置头
                    xmlhttp.setRequestHeader("Content-Length",xmldoc.length);
                    
    //设置头信息
                    xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=UTF-8");//使用post发送,此句必不可少

                    
    //指定回调函数
                    xmlhttp.onreadystatechange = onReadyStateChange;//onreadystatechange要放在setRequestHeader之后
                    //发送
                    //xmlhttp.send("xml="+xmldoc);
                    xmlhttp.send(xmldoc);
                }

                
                
    // 回调函数
                function onReadyStateChange()
                
    {
                    
    if (xmlhttp.readyState == 4)
                    
    {
                        
    if (xmlhttp.status == 200)
                        
    {
                            
    //alert(xmlhttp.responseText);
                            document.getElementById("text").innerHTML = 
                                xmlhttp.responseText;
                        }

                    }

                }

        
    </script>

    </head>
    <body>
        
    <input type="button" id="post" value="提交" onclick="postClick()" />
        <div id="text">
        
    </div>
    </body>
    </html>
    2、使用jquery类库post到.aspx页面
    <!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>使用jquery发送</title>

        
    <script type="text/javascript" src="js/jquery.js"></script>

        
    <script type="text/javascript">
                
    function postClick(){

                    
    //发送一个xml文档
                    var xml="<?xml version=\"1.0\" encoding=\"utf-8\" ?><UserInfo><User><UserName>小李</UserName><UserSex>男</UserSex><UserTel>123</UserTel><UserEmail>fdsfds@126.com</UserEmail></User><User><UserName>小林</UserName><UserSex>男</UserSex><UserTel>145</UserTel><UserEmail>xiaolin@126.com</UserEmail></User></UserInfo>";
                    
    var xmldoc=new ActiveXObject("MSXML2.DOMDocument");
                    xmldoc.loadXML(xml);
                    
    //发送字符串
                    //var xmldoc="测试数据,post异步提交"
                    //xmldoc = 'name=' +xmldoc;
                    $.ajax(
                        type:
    "POST",
                        url:
    "jQueryPostServer.aspx"
                        processData:
    false,//当发送字符串时设为true,当发送文档对象时设为false
                        data:xmldoc, 
                        async:
    true,
                        beforeSend:beforeFun,
                        success:onReadyStateChange,
                        error:errorFun,
                        timeout:
    5000
                    }
    );

                }

                
    //发送前函数
                function beforeFun(){
                    $(
    "#text").html("loading");
                }

                
    // 回调函数
                function onReadyStateChange(returnValue)
                
    {
                    
    //alert(returnValue);
                    $("#text").html(returnValue+"交互成功!!");
                }

                
    //错误信息
                function errorFun()
                
    {
                    $(
    "#text").html("数据加载错误");
                }

        
    </script>

    </head>
    <body>
        
    <div>
            
    <input type="button" id="post" value="提交" onclick="postClick()" />
            <div id="text">
            
    </div>
        </div>
    </body>
    </html>

    /**********************.aspx后台代码*******************************************************************************/
    using System;
    using System.Data;
    using System.Configuration;
    using System.Collections;
    using System.Web;
    using System.Web.Security;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.WebControls.WebParts;
    using System.Web.UI.HtmlControls;

    public partial class jQueryPostServer : System.Web.UI.Page
    {
        
    protected void Page_Load(object sender, EventArgs e)
        
    {
            
    //清除缓存
            Response.Buffer = true;
            Response.ExpiresAbsolute 
    = DateTime.Now.AddDays(-1);
            Response.Cache.SetExpires(DateTime.Now.AddDays(
    -1));
            Response.Expires 
    = 0;
            Response.CacheControl 
    = "no-cache";
            Response.Cache.SetNoStore();

            Response.ContentType 
    = "text/plain";
            
    string PostSend = string.Empty;
            
    //当发送的是一个字符串时
            
    //当发送的是一个XML文档对象时

            
    //打印出UserName
            Response.Write(PostSend);
        }

    }

  • 相关阅读:
    485串口接线
    mvc3 升级mvc5
    VB连接ACCESS数据库,使用 LIKE 通配符问题
    VB6 读写西门子PLC
    可用的 .net core 支持 RSA 私钥加密工具类
    解决 Win7 远程桌面 已停止工作的问题
    解决 WinForm 重写 CreateParams 隐藏窗口以后的显示问题
    解决安装 .net framework 发生 extracting files error 问题
    CentOS7 安装配置笔记
    通过特殊处理 Resize 事件解决 WinForm 加载时闪烁问题的一个方法
  • 原文地址:https://www.cnblogs.com/xnxylf/p/1534982.html
Copyright © 2011-2022 走看看