1. 程式人生 > >prototype.js 的 Ajax.updater 的 用法以及替換方式

prototype.js 的 Ajax.updater 的 用法以及替換方式

   Ajax.updater 將後臺返回的html格式的字串拼進div,如果替換,就直接用普通ajax請求,獲取資料innerHtml()就好

下面是網上的updater介紹

如果你的伺服器的另一端返回的資訊已經是 HTML 了,那麼使用這個程式包中 Ajax.Updater 類將使你的生活變得更加得容易。

ajax.updater 方法有3個引數: ajax.updater(container, url, options)
分別表示 1.控制元件id;2.請求的url;3.具體如下(可選):

屬性型別Default描述 method Array 'post' HTTP 請求方式。get or post parameters String '' 在HTTP請求中傳入的url格式的值列表。 asynchronous Boolean true 指定是否做非同步 AJAX 請求。 postBody String undefined 在HTTP POST的情況下,傳入請求體中的內容。 requestHeaders Array undefined 和請求一起被傳入的HTTP頭部列表, 這個列表必須含有偶數個專案, 任何奇數專案是自定義的頭部的名稱, 接下來的偶數專案使這個頭部專案的字串值。 例子:['my-header1', 'this is the value', 'my-other-header', 'another value'] onXXXXXXXX Function(XMLHttpRequest) undefined 在AJAX請求中,當相應的事件/狀態形成的時候呼叫的自定義方法。 例如 var myOpts = {onComplete: showResponse, onLoaded: registerLoaded};. 這個方法將被傳入一個引數, 這個引數是攜帶AJAX操作的 XMLHttpRequest物件。 onSuccess Function(XMLHttpRequest) undefined 當AJAX請求成功完成的時候呼叫的自定義方法。 這個方法將被傳入一個引數, 這個引數是攜帶AJAX操作的 XMLHttpRequest物件。 onFailure Function(XMLHttpRequest) undefined 當AJAX請求完成但出現錯誤的時候呼叫的自定義方法。 這個方法將被傳入一個引數, 這個引數是攜帶AJAX操作的 XMLHttpRequest物件。 insertion Function(Object, String) null 為了把返回的文字注入到一個元素中而執行的方法。 這個方法將被傳入兩個引數,要被更新的物件並且只應用於 

Ajax.Updater 的響應文字 。 evalScripts Boolean undefined, false 決定當響應到達的時候是否執行其中的指令碼塊,只在 Ajax.Updater 物件中應用。 decay Number undefined, 1 決定當最後一次響應和前一次響應相同時在 Ajax.PeriodicalUpdater 物件中的減漫訪問的次數, 例如,如果設為2,後來的重新整理和之前的結果一樣, 這個物件將等待2個設定的時間間隔進行下一次重新整理, 如果又一次一樣, 那麼將等待4次,等等。 不設定這個只,或者設定為1,將避免訪問頻率變慢。

function getContents() 

var request_url = "test1.html";       // 需要獲取內容的url 
var request_pars = '';//請求引數 

var myAjax = new Ajax.Updater('result', request_url,{ // 將request_url返回內容繫結到id為result的容器中 
method     : 'get', //HTTP請求的方法,get or post 
parameters : request_pars, //請求引數 
onFailure  : reportError, //失敗的時候呼叫 reportError 函式 
onLoading  : loading, //正在獲得內容的時候 
onComplete : done     //內容獲取完畢的時候 
}); 


function loading() 

$('loading').style.display = 'block'; 


function done() 

$('loading').style.display = 'none'; 


function reportError(request) 

alert('Sorry. There was an error.'); 

Ajax.Updater為我們提供載入文件時候的三種狀態, onComplete,onLoading,onFailure.我們可以自定義一個函式分別相應這三種不同的狀態。
下面的例子用到了success (一切OK的時候才被用到) ,和它同等地位的屬性還有一個failure (有地方出問題的時候被用到) 這裡沒用到。出錯時在 onFailure 處呼叫 reportError 方法。

<script>
    function getHTML()
    {
        var url = 'http://yourserver/app/getSomeHTML';
        var pars = 'someParameter=ABC';
        var myAjax = new Ajax.Updater(
                    {success: 'placeholder'},
                    url,
                    {method: 'get', parameters: pars, onFailure: reportError});
    }
    function reportError(request)
    {
        alert('Sorry. There was an error.');
    }
</script>

<input type=button value=GetHtml onclick="getHTML()">
<div id="placeholder"></div>

相關推薦

prototype.jsAjax.updater用法以及替換方式

   Ajax.updater 將後臺返回的html格式的字串拼進div,如果替換,就直接用普通ajax請求,獲取資料innerHtml()就好 下面是網上的updater介紹 如果你的伺服器的另一端返回的資訊已經是 HTML 了,那麼使用這個程式包中 Ajax.Up

JS ajax請求 formData傳參方式

alert UNC log 類型 pan ... tro for als 1 $("#importBtn").click(function(){ 2 if($("#conId").val() == ""){ 3

【菜鳥學WCF】使用js+ajax呼叫WCF以及返回資料型別的控制

先上程式碼,再談問題。 Service1.svc.cs程式碼: using System; using System.Collections.Generic; using System.Linq; using System.Runtime.Serialization;

js物件中原型(prototype)的使用方法、替換以及注意事項

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <t

js學習總結----ajax中的http請求方式及同步編程和異步編程

功能 依然 interval 需要 發送請求 console dom 屬於 相關 一、請求方式 var xhr = createXHR(); xhr.open("get","/getList?num=12",true); xhr.open("post","/getList

JS 自定義sleep以及Ajax 自執行函式

<script src="/static/js/jquery-2.1.1.min.js"></script> <script> function sleep(numberMillis) { var now = new D

ajax非同步請求以及Jquery框架封裝的非同步請求方式

一、AJAX - 阿賈克斯 1、什麼是AJAX? Asynchronous Javascript And Xml 是可以建立快速動態網頁的技術。可以實現非同步更新,而不需要載入整個網頁,只加載需要更 新某部分網頁。

js中typeof和instanceof的基本用法以及區別

JavaScript 中 typeof 和 instanceof 通常都會用來判斷一個變數是否為空,或者是什麼型別的。但在具體使用中它們之間還是有區別的: 首先我們來說一下typeof的用法以及需要注意的地方: typeof 是一個一元運算,放在一個運算數之前,這個運算數可以是任意的

JS跨域問題以及採用JSONP方式解決跨域問題

在做專案的時候,客戶要做成客戶端和服務端兩部分,客戶端向服務端進行認證,我開始的時候沒有直接替換ip地址,後來採用ip地址替換之後,出現了問題,後臺可以收到訪問的請求,但是無法拿到後臺返回的資訊,後來

js教程--從入門到精通 第一篇 js的前世今生以及js中基本資料型別和引入方式

1、Javascript前世今生    1.1、什麼是Javascript       Javascript運行於Javascript 【直譯器/引擎】中的解釋性指令碼語言     &nb

js教程--從入門到精通 第一篇 js的前世今生以及js中基本數據類型和引入方式

美國 ros 發布 命令行工具 相似性 百度瀏覽器 個數字 網頁瀏覽 實現 1、Javascript前世今生 1.1、什麽是Javascript Javascript運行於Javascript 【解釋器/引擎】中的解釋性腳本語言 Javascrip

emasc: JS 中 throw 與 Error 用法 以及 異常捕獲

emasc: JS 中 throw 與 Error 用法 以及 異常捕獲 在JS中,一旦出現某個錯誤,接下來的JS程式碼都會停止執行,這樣就顯的程式碼非常的不健壯。如果對異常進行捕獲處理,那麼接下來的JS程式碼會繼續執行。 JS 異常捕獲機制 try catch try { throw new

前端JS陣列的刪除、新增方式以及字串和陣列的相互轉換、陣列的合併

<script> var array=[1,3,5]; console.log(array); array.push(7,9); console.log("陣列後邊加入元素="+array); /

JSONObject JSONArray 各種用法以及js eval()函式

一、在後臺使用JSONObject物件,並將從資料庫中取出來的資料直接使用 JSONObject的put方法放進去,再將這個JSONOject物件使用JSONArray的add()方法新增進去,這樣就是一個儲存了json物件的陣列,在後臺將JSONArray物件使用toSt

C++中public、protected及private用法 以及各種繼承方式的影響 (二)

在學習C++時經常會混淆public、protected、private在繼承中的概念,於是寫在此部落格加深理解。  首先記住以下三點: 使用者程式碼(類外)只能訪問public成員變數和public成員函式。 子類(繼承類)能訪問基類的public和protected

幾個例子弄懂JS 的setTimeout的運行方式

-a highlight margin java p s .com cti x11 on() function test() { var a = 1; setTimeout(function() {

原生JS Ajax 請求

else 對象 amp pan stat func ext val hang        var username = document.getElementById(‘username‘).value; var password = docum

Server Tomcat v7.0 Server at localhost failed to start報錯以及解決方式

ron build oca led 無法 cat servle 問題 pan 現象: 昨天在一個web項目中新建了一個servlet以後,tomcat服務器就一直無法啟動,報Server Tomcat v7.0 Server at localhost failed to s

js 定時器用法詳解——setTimeout()、setInterval()、clearTimeout()、clearInterval()

ntb 幫助 .get tint num 用法 -c 函數 tel 在js應用中,定時器的作用就是可以設定當到達一個時間來執行一個函數,或者每隔幾秒重復執行某段函數。這裏面涉及到了三個函數方法:setInterval()、setTimeout()、clearI

Android與JS互相調用以及註意

import 調用 spa sha 技術 作用 zhang ces wan 近期項目中常常使用Html5而Android與JS調用常常會用到,這裏記錄一下,測試系統5.0以上。這裏先貼一下源代碼Activity:package jwzhangjie.com.webview