AJAX代码示例(不使用AJAX控件)
生活随笔
收集整理的這篇文章主要介紹了
AJAX代码示例(不使用AJAX控件)
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
<script type="text/javascript">function btnClick() {var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); //創(chuàng)建XMLHTTP對象,相當(dāng)于WebClientif (!xmlHttp) {alert("創(chuàng)建xmlHttp異常!");return false;}xmlHttp.open("POST", "GetTime.ashx?t=" + new Date(), false); //準(zhǔn)備向服務(wù)器的GetDate1.ashx發(fā)出POST請求xmlHttp.onreadystatechange = function () {if (xmlHttp.readyState == 4) {if (xmlHttp.status == 200) {document.getElementById("Text1").value = xmlHttp.responseText;}else {alert("AJAX返回錯(cuò)誤!");}}}xmlHttp.send();}</script>
使用JQuery實(shí)現(xiàn)AJAX效果:
?
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script><script type="text/javascript">function btnClick() {$.post("GetTime.ashx", function (data, status) {$("#Text1").val(status);});}</script> <input id="Text1" type="text" value="初始值" /><input id="Button1" type="button" value="button" οnclick="btnClick()" />?
不用服務(wù)端控件:
服務(wù)端控件是asp.netWebForm程序在服務(wù)端操作頁面的時(shí)候使用的,不需要的時(shí)候就不使用。
?
<!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 src="Scripts/jquery-1.4.1.js" type="text/javascript"></script><script type="text/javascript">$(function (){$.post("ShowMsg.ashx", function (data, status){if (status == "success"){var tableTop = $("<tr><td>序號序號</td><td>內(nèi)容</td><td>時(shí)間</td></tr>");$("#tableComment").append(tableTop);var lines = data.split("$");for (var i = 0; i < lines.length; i++){var fields = lines[i].split("|");// var comm = $("<li>" + fields[0] + " " + fields[1] + " " + fields[2] + "</li>")var tableComm = $("<tr><tb>" + fields[0] + "</tb><tb>" + fields[1] + "</tb><tb>" + fields[2] + "</tb></tr>");$("#tableComment").append(tableComm);//$("#pinglun").append(comm);}//$("#TextArea1").val(data);}else{$("#TextArea1").val("加載失敗!");}});});</script></head><body><textarea id="TextArea1" cols="20" rows="2"></textarea><!--<ul id="pinglun"><li>序號 評論內(nèi)容 時(shí)間 </li></ul>--><table id="tableComment"><tr><td>序號序號</td><td>內(nèi)容</td><td>時(shí)間</td></tr></table></body></html>使用Repeater顯示評論內(nèi)容<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ShowMsg.aspx.cs" Inherits="WebApplicationAJAX.ShowMsg1" %><!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 runat="server"><title></title></head><body><form id="form1" runat="server"><asp:ObjectDataSource ID="ObjectDataSource1" runat="server" DeleteMethod="Delete" InsertMethod="Insert" OldValuesParameterFormatString="original_{0}" SelectMethod="GetData" TypeName="WebApplicationAJAX.NoRefreshTableAdapters.T_PostMsgTableAdapter" UpdateMethod="Update"><DeleteParameters><asp:Parameter Name="Original_Id" Type="Int32" /></DeleteParameters><InsertParameters><asp:Parameter Name="IpAddr" Type="String" /><asp:Parameter Name="Msg" Type="String" /><asp:Parameter Name="PostDate" Type="DateTime" /></InsertParameters><UpdateParameters><asp:Parameter Name="IpAddr" Type="String" /><asp:Parameter Name="Msg" Type="String" /><asp:Parameter Name="PostDate" Type="DateTime" /><asp:Parameter Name="Original_Id" Type="Int32" /></UpdateParameters></asp:ObjectDataSource><asp:Repeater ID="Repeater1" runat="server" DataSourceID="ObjectDataSource1"><HeaderTemplate><table><tr><td>評論內(nèi)容</td><td>提交日期</td><td>用戶Ip</td></tr></HeaderTemplate><FooterTemplate></table></FooterTemplate><ItemTemplate><tr><td><%#Eval("Msg")%></td><td><%#Eval("PostDate")%></td><td><%#Eval("IpAddr")%></td></tr></ItemTemplate></asp:Repeater></form></body></html>?
問題:
在使用JavaScript調(diào)用一般處理程序的結(jié)果拼接table的時(shí)候,拼接的頭部無法顯示到最上方而是顯示到了table的下方。
應(yīng)該考慮研究的問題:使用JQuery+JavaScript對Html進(jìn)行動(dòng)態(tài)生成的時(shí)候,標(biāo)簽的寫法以及添加標(biāo)簽的順序。
?
?
?
轉(zhuǎn)載于:https://www.cnblogs.com/xuhongfei/archive/2013/03/02/2939747.html
總結(jié)
以上是生活随笔為你收集整理的AJAX代码示例(不使用AJAX控件)的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 使用find 命令执行命令 -exec
- 下一篇: 二十、UE和UI的区别