通过 Ajax 获取数据





0/5 (0投票)
步骤 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:
<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" />
<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();
}
}