65.9K
CodeProject 正在变化。 阅读更多。
Home

通过 Ajax 获取数据

emptyStarIconemptyStarIconemptyStarIconemptyStarIconemptyStarIcon

0/5 (0投票)

2013 年 10 月 11 日

CPOL

3分钟阅读

viewsIcon

4683

步骤 1:在此示例中,有三个文本框(txtid、txtfname、txtsubject)和一个按钮(btnshow)。单击按钮时,我们可以获取值

步骤 1:在此示例中,有三个文本框(txtid、txtfname、txtsubject)和一个按钮(btnshow)。单击按钮时,我们可以从文本框中获取值,并在

标签(pid、pname、psubject)的帮助下将其显示在一行中

 

      ID: <input id="txtid" runat="server" type="text" />

<br />

      姓名: <input id="txtfname" runat="server" type="text" />

       <br />

       主题:<input id="txtsubject" type="text" runat="server"/>

       <br />

       <br />

<input id="btnshow" type="button" onclick="ShowText()" value="Show" />

 

步骤 2:单击按钮(btnshow)时,它会调用一个名为(ShowText( ))的函数。在此函数中:

 

 

var xmlHttp

        var arr;

        function ShowText() {

            xmlHttp = GetXmlHttpObject()

            var url = "Default.aspx"

            url = url + "?id=" + document.getElementById('txtid').value

            xmlHttp.onreadystatechange = stateChanged

            xmlHttp.open("GET", url, true)

            xmlHttp.send(null)

            return false;

        

 

现在我们可以编写 GetXmlHttpObject() 来检查浏览器

function GetXmlHttpObject() {

 

            var objXMLHttp = null

            if (window.XMLHttpRequest) {

                objXMLHttp = new XMLHttpRequest()

            }

            else if (window.ActiveXObject) {

                objXMLHttp = new ActiveXObject("Microsoft.XMLHTTP")

            }

            return objXMLHttp

        }

 

 

步骤 3: Page_Load 事件中

 

 

if (!IsPostBack)

        {

 

            if (Request.QueryString["id"] != null)

            {

                string str = txtid.Value;

 

                Response.Clear();

 

                Response.Write(str);

                Response.End();

            }显示值

 

        }

 

它将 txtid 的值设置为 str。 

 

 

在 Default.aspx 中

 

<head runat="server">

 

    <title></title>

 

    <script language="JavaScript" type="text/javascript" >

        var xmlHttp

        var arr;

        function ShowText() {

            xmlHttp = GetXmlHttpObject()

            var url = "Default.aspx"

            url = url + "?id=" + document.getElementById('txtid').value

            xmlHttp.onreadystatechange = stateChanged

            xmlHttp.open("GET", url, true)

            xmlHttp.send(null)

            return false;

        }

        function stateChanged() {

 

            if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete") {

 

                var str;

 

                str = xmlHttp.responseText;

 

                if (str != " ") {

                    document.getElementById("pid").innerHTML = document.getElementById("txtid").value;

                    document.getElementById("pname").innerHTML = document.getElementById("txtfname").value;

                    document.getElementById("psubject").innerHTML = document.getElementById("txtsubject").value;

                }

               

               

            }

        }

        function GetXmlHttpObject() {

 

            var objXMLHttp = null

            if (window.XMLHttpRequest) {

                objXMLHttp = new XMLHttpRequest()

            }

            else if (window.ActiveXObject) {

                objXMLHttp = new ActiveXObject("Microsoft.XMLHTTP")

            }

            return objXMLHttp

        }

 

 </script>

 

 

    <style type="text/css">

        #pid

        {

            height: 11px;

            width: 43px;

        }

    </style>

 

 

</head>

<body>

    <form id="form1" runat="server">

    ID:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;   

    <input id="txtid" runat="server" type="text" />

   

    <br />

    姓名&nbsp;&nbsp;&nbsp;

    <input id="txtfname" runat="server" type="text" />

    <br />

    主题&nbsp;

    <input id="txtsubject" type="text" runat="server"/>

    <br />

    <br />

    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

    <input id="btnshow" type="button" onclick="ShowText()" value="Show" />

   

    <br />

    <br />

    <br />

    你的ID<p id="pid"></p>

    姓名:  <p id="pname"></p> 主题: <p id="psubject"></p> </form>

</body>

</html>

 

 

 

Default.aspx.cs

 

 

protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {

 

            if (Request.QueryString["id"] != null)

            {

                string str = txtid.Value;

 

                Response.Clear();

 

                Response.Write(str);

                Response.End();

            }

 

        }

 

 

© . All rights reserved.