方法一:
局部重新整理我們講述到最多的是ajax 了,當然也可以不使用ajax來重新整理頁面了,我們可以使用jquery中的append來給指定內容加東西了,當然最實用的還是ajax載入資料了。
例子,定時局部重新整理
定時局部重新整理用到jQuery裡面的setInterval方法,setInterval方法兩個參數,第一個是設定定時執行的函數名,第二個是時間,如下代碼所示,設定每隔10微秒定時執行一次aa方法。
<script>$(function(){ setInterval(aa,10); function aa(){ $("#aa").append("fdsadfsa"); }})</script>
例子2
<head><script src="jQuery/jquery-1.4.1.min.js" type="text/javascript"></script><script>$(document).ready(function () {setInterval("startRequest()",1000);});function startRequest(){$("#date").text((new Date()).toString());}</script></head>
例子3 下面我們就看一下這種重新整理方式是如何?的。
jsp頁面ajax
$("#waitWork").click(function(){ var url = "請求地址"; var data = {type:1}; $.ajax({ type : "get", async : false, //同步請求 url : url, data : data, timeout:1000, success:function(dates){ //alert(dates); $("#mainContent").html(dates);//要重新整理的div }, error: function() { // alert("失敗,請稍後再試!"); } }); });
html
注意:後台需要針對div裡的資訊單獨用一個jsp頁面,不然就需要自己封裝好需要的頁面資訊返回
方法二:
不時,我需要某種機制,不斷重新整理網頁,以提供一個即時的儀表板某種。如果我只能重新整理一個特定的頁面的一部分,這將是很大的,例如:儀錶盤上的交通燈顯示系統狀態。
這是很容易通過使用jQuery JavaScript庫,只重新整理頁面的一部分。一旦我們納入我們的頁面的jQuery庫,我們只需要1行的
JavaScript得到它的工作:
<script src="/js/jquery-1.3.2.min.js" type="text/javascript"></script>
所以我們只要我們的頁面放入這個小的JS程式碼片段重新整理裡面的內容ID標籤的一切,讓我們說,每5秒:
setInterval(function() { $("#content").load(location.href+" #content>*","");}, 5000);
這就是它!!因此,這是很容易完成一些即時監控的行為,只是那行代碼。沒有更奇怪的元重新整理標記或iframe一種解決方案,在Web應用程式。
每5秒,我們將重新整理內容相同的URL和所有元素,駐留在元素ID為content元素的內容:內容。