1. Prototype是什么?
或許你還沒(méi)有用過(guò)它, prototype.js 是一個(gè)由Sam Stephenson寫(xiě)的JavaScript包。這個(gè)構(gòu)思奇妙編寫(xiě)良好的一段兼容標(biāo)準(zhǔn)的一段代碼將承擔(dān)創(chuàng)造胖客戶(hù)端, 高交互性WEB應(yīng)用程序的重?fù)?dān)。輕松加入Web 2.0特性。
如果你最近體驗(yàn)了這個(gè)程序包,你很可能會(huì)發(fā)現(xiàn)文檔并不是它的強(qiáng)項(xiàng)之一。像所有在我之前的開(kāi)發(fā)者一樣,我只能一頭扎進(jìn)prototype.js的源代碼中并且試驗(yàn)其中的每一個(gè)部分。 我想當(dāng)我學(xué)習(xí)他的時(shí)候記寫(xiě)筆記然后分享給其他人將會(huì)很不錯(cuò)。
我也一起提供了這個(gè)包的對(duì)象,類(lèi),方法和擴(kuò)展的 非官方參考 。
2. 通用性方法
這個(gè)程序包里面包含了許多預(yù)定義的對(duì)象和通用性方法。編寫(xiě)這些方法的明顯的目的就是為了減少你大量的重復(fù)編碼和慣用法。
2.1. 使用 $()方法
$() 方法是在DOM中使用過(guò)于頻繁的 document.getElementById() 方法的一個(gè)便利的簡(jiǎn)寫(xiě),就像這個(gè)DOM方法一樣,這個(gè)方法返回參數(shù)傳入的id的那個(gè)元素。
比起DOM中的方法,這個(gè)更勝一籌。你可以傳入多個(gè)id作為參數(shù)然后 $() 返回一個(gè)帶有所有要求的元素的一個(gè) Array 對(duì)象。下面的例子會(huì)向你描述這些。
<HTML>
<HEAD>
<TITLE> Test Page </TITLE>
<script src="prototype-1.3.1.js"></script>
<script>
function test1()
{
var d = $('myDiv');
alert(d.innerHTML);
}
function test2()
{
var divs = $('myDiv','myOtherDiv');
for(i=0; i<divs.length; i++)
{
alert(divs[i].innerHTML);
}
}
</script>
</HEAD>
<BODY>
<div id="myDiv">
<p>This is a paragraph</p>
</div>
<div id="myOtherDiv">
<p>This is another paragraph</p>
</div>
<input type="button" value=Test1 onclick="test1();"><br>
<input type="button" value=Test2 onclick="test2();"><br>
</BODY>
</HTML>這個(gè)方法的另一個(gè)好處就是你可以傳入id字符串或者元素對(duì)象自己,這使得在創(chuàng)建可以傳入任何形式參數(shù)的方法的時(shí)候, 它變得非常有用。
2.2. 使用$F()方法
$F()方法是另一個(gè)非常受歡迎的簡(jiǎn)寫(xiě)。它可以返回任何輸入表單控件的值,如文本框或下拉框。 這個(gè)方法可以傳入元素的id或者元素自己。
<script>
function test3()
{
alert( $F('userName') );
}
</script>
<input type="text" id="userName" value="Joe Doe"><br>
<input type="button" value=Test3 onclick="test3();"><br>2.3. 使用Try.these()方法
Try.these() 方法使得實(shí)現(xiàn)當(dāng)你想調(diào)用不同的方法直到其中的一個(gè)成功正常的這種需求變得非常容易, 他把一系列的方法作為參數(shù)并且按順序的一個(gè)一個(gè)的執(zhí)行這些方法直到其中的一個(gè)成功執(zhí)行,返回成功執(zhí)行的那個(gè)方法的返回值。
在下面的例子中, xmlNode.text在一些瀏覽器中好用,但是xmlNode.textContent在另一些瀏覽器中正常工作。 使用Try.these()方法我們可以得到正常工作的那個(gè)方法的返回值。
<script>
function getXmlNodeValue(xmlNode){
return Try.these(
function() {return xmlNode.text;},
function() {return xmlNode.textContent;)
);
}
</script>3. Ajax 對(duì)象
上面提到的共通方法非常好,但是面對(duì)它吧,它們不是最高級(jí)的那類(lèi)東西。它們是嗎?你很可能自己編寫(xiě)了這些甚至在你的腳本里面有類(lèi)似功能的方法。但是這些方法只是冰山一角。
我很肯定你對(duì)prototype.js感興趣的原因很可能是由于它的AJAX能力。所以讓我們解釋當(dāng)你需要完成AJAX邏輯的時(shí)候,這個(gè)包如何讓它更容易。
Ajax 對(duì)象是一個(gè)預(yù)定義對(duì)象,由這個(gè)包創(chuàng)建,為了封裝和簡(jiǎn)化編寫(xiě)AJAX 功能涉及的狡猾的代碼。 這個(gè)對(duì)象包含一系列的封裝AJAX邏輯的類(lèi)。我們來(lái)看看它們的一些。
3.1. 使用 Ajax.Request類(lèi)
如果你不使用任何的幫助程序包,你很可能編寫(xiě)了整個(gè)大量的代碼來(lái)創(chuàng)建XMLHttpRequest對(duì)象并且異步的跟蹤它的進(jìn)程, 然后解析出響應(yīng) 然后處理它。當(dāng)你不需要支持多于一種類(lèi)型的瀏覽器時(shí)你會(huì)感到非常的幸運(yùn)。
為了支持 AJAX 功能。這個(gè)包定義了 Ajax.Request 類(lèi)。
假如你有一個(gè)應(yīng)用程序可以通過(guò)url http://yoursever/app/get_sales?empID=1234&year=1998與服務(wù)器通信。它返回下面這樣的XML 響應(yīng)。
<?xml version="1.0" encoding="utf-8" ?>
<ajax-response>
<response type="object" id="productDetails">
<monthly-sales>
<employee-sales>
<employee-id>1234</employee-id>
<year-month>1998-01</year-month>
<sales>$8,115.36</sales>
</employee-sales>
<employee-sales>
<employee-id>1234</employee-id>
<year-month>1998-02</year-month>
<sales>$11,147.51</sales>
</employee-sales>
</monthly-sales>
</response>
</ajax-response>用 Ajax.Request對(duì)象和服務(wù)器通信并且得到這段XML是非常簡(jiǎn)單的。下面的例子演示了它是如何完成的。
<script>
function searchSales()
{
var empID = $F('lstEmployees');
var y = $F('lstYears');
var url = 'http://yoursever/app/get_sales';
var pars = 'empID=' + empID + '&year=' + y;
var myAjax = new Ajax.Request(
url,
{method: 'get', parameters: pars, onComplete: showResponse}
);
}
function showResponse(originalRequest)
{
//put returned XML in the textarea
$('result').value = originalRequest.responseText;
}
</script>
<select id="lstEmployees" size="10" onchange="searchSales()">
<option value="5">Buchanan, Steven</option>
<option value="8">Callahan, Laura</option>
<option value="1">Davolio, Nancy</option>
</select>
<select id="lstYears" size="3" onchange="searchSales()">
<option selected="selected" value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
</select>
< br><textarea id=result cols=60 rows=10 ></textarea>你看到傳入 Ajax.Request構(gòu)造方法的第二個(gè)對(duì)象了嗎? 參數(shù){method: 'get', parameters: pars, onComplete: showResponse} 表示一個(gè)匿名對(duì)象的真實(shí)寫(xiě)法。他表示你傳入的這個(gè)對(duì)象有一個(gè)名為 method 值為 'get'的屬性,另一個(gè)屬性名為 parameters 包含HTTP請(qǐng)求的查詢(xún)字符串,和一個(gè)onComplete 屬性/方法包含函數(shù) showResponse。
還有一些其它的屬性可以在這個(gè)對(duì)象里面定義和設(shè)置,如 asynchronous,可以為true 或 false 來(lái)決定AJAX對(duì)服務(wù)器的調(diào)用是否是異步的(默認(rèn)值是 true)。
這個(gè)參數(shù)定義AJAX調(diào)用的選項(xiàng)。在我們的例子中,在第一個(gè)參數(shù)通過(guò)HTTP GET命令請(qǐng)求那個(gè)url,傳入了變量 pars包含的查詢(xún)字符串, Ajax.Request 對(duì)象在它完成接收響應(yīng)的時(shí)候?qū)⒄{(diào)用showResponse 方法。
也許你知道, XMLHttpRequest在HTTP請(qǐng)求期間將報(bào)告進(jìn)度情況。這個(gè)進(jìn)度被描述為四個(gè)不同階段:Loading, Loaded, Interactive, 或 Complete。你可以使 Ajax.Request 對(duì)象在任何階段調(diào)用自定義方法 ,Complete 是最常用的一個(gè)。想調(diào)用自定義的方法只需要簡(jiǎn)單的在請(qǐng)求的選項(xiàng)參數(shù)中的名為 onXXXXX 屬性/方法中提供自定義的方法對(duì)象。 就像我們例子中的 onComplete 。你傳入的方法將會(huì)被用一個(gè)參數(shù)調(diào)用,這個(gè)參數(shù)是 XMLHttpRequest 對(duì)象自己。你將會(huì)用這個(gè)對(duì)象去得到返回的數(shù)據(jù)并且或許檢查包含有在這次調(diào)用中的HTTP結(jié)果代碼的 status 屬性。
還有另外兩個(gè)有用的選項(xiàng)用來(lái)處理結(jié)果。我們可以在 onSuccess 選項(xiàng)處傳入一個(gè)方法,當(dāng)AJAX無(wú)誤的執(zhí)行完后調(diào)用, 相反的,也可以在onFailure選項(xiàng)處傳入一個(gè)方法,當(dāng)服務(wù)器端出現(xiàn)錯(cuò)誤時(shí)調(diào)用。正如onXXXXX 選項(xiàng)傳入的方法一樣,這兩個(gè)在被調(diào)用的時(shí)候也傳入一個(gè)帶有AJAX請(qǐng)求的XMLHttpRequest對(duì)象。
我們的例子沒(méi)有用任何有趣的方式處理這個(gè) XML響應(yīng), 我們只是把這段XML放進(jìn)了一個(gè)文本域里面。對(duì)這個(gè)響應(yīng)的一個(gè)典型的應(yīng)用很可能就是找到其中的想要的信息,然后更新頁(yè)面中的某些元素, 或者甚至可能做某些XSLT轉(zhuǎn)換而在頁(yè)面中產(chǎn)生一些HTML。
更完全的解釋?zhuān)?qǐng)參照 Ajax.Request 參考 和 Ajax選項(xiàng)參考。
3.2. 使用 Ajax.Updater 類(lèi)
如果你的服務(wù)器的另一端返回的信息已經(jīng)是HTML了,那么使用這個(gè)程序包中 Ajax.Updater 類(lèi)將使你的生活變得更加得容易。用它你只需提供哪一個(gè)元素需要被AJAX請(qǐng)求返回的HTML填充就可以了,例子比我寫(xiě)說(shuō)明的更清楚。
<script>
function getHTML()
{
var url = 'http://yourserver/app/getSomeHTML';
var pars = 'someParameter=ABC';
var myAjax = new Ajax.Updater('placeholder', url, {method: 'get', parameters: pars});
}
</script>
<input type=button value=GetHtml onclick="getHTML()">
< div id="placeholder"></div>你可以看到,這段代碼比前面的例子更加簡(jiǎn)潔,不包括 onComplete 方法,但是在構(gòu)造方法中傳入了一個(gè)元素id。 我們來(lái)稍稍修改一下代碼來(lái)描述如何在客戶(hù)端處理服務(wù)器段錯(cuò)誤成為可能。
我們將加入更多的選項(xiàng), 指定處理錯(cuò)誤的一個(gè)方法。這個(gè)是用 onFailure 選項(xiàng)來(lái)完成的。
我們也指定了一個(gè) placeholder 只有在成功請(qǐng)求之后才會(huì)被填充。為了完成這個(gè)目的我們修改了第一個(gè)參數(shù)從一個(gè)簡(jiǎn)單的元素id到一個(gè)帶有兩個(gè)屬性的對(duì)象, success (一切OK的時(shí)候被用到) 和 failure (有地方出問(wèn)題的時(shí)候被用到) 在下面的例子中沒(méi)有用到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>
如果你的服務(wù)器邏輯是返回JavaScript 代碼而不是單純的 HTML 標(biāo)記, Ajax.Updater對(duì)象可以執(zhí)行那段JavaScript代碼。為了使這個(gè)對(duì)象對(duì)待響應(yīng)為JavaScript,你只需在最后參數(shù)的對(duì)象構(gòu)造方法中簡(jiǎn)單加入evalScripts: true屬性。
更完全的解釋?zhuān)?qǐng)參照 Ajax.Updater 參考 和 Ajax選項(xiàng)參考 。
4. prototype.js參考
4.1. JavaScript 類(lèi)的擴(kuò)展
prototype.js 包中加入功能的一種途徑就是擴(kuò)展已有的JavaScript 類(lèi)。
4.2. 對(duì) Object 類(lèi)的擴(kuò)展
Table 1. Object 類(lèi)的擴(kuò)展
方法 類(lèi)別 參數(shù) 描述
extend(destination, source) static destination: 任何對(duì)象, source: 任何對(duì)象 用從 source 到 destination復(fù)制所有屬性和方法的方式 來(lái)提供一種繼承機(jī)制。
extend(object) instance 任何對(duì)象 用從傳入的 object 中復(fù)制所有屬性和方法的方式 來(lái)提供一種繼承機(jī)制。
4.3. 對(duì) Number 類(lèi)的擴(kuò)展
Table 2. Number 類(lèi)的擴(kuò)展
方法 類(lèi)別 參數(shù) 描述
toColorPart() instance (none) 返回?cái)?shù)字的十六進(jìn)制描述, 當(dāng)在HTML中轉(zhuǎn)換為RGB顏色組件到HTML中使用的顏色。
4.4. 對(duì) Function 類(lèi)的擴(kuò)展
Table 3. 對(duì) Function 類(lèi)的擴(kuò)展
方法 類(lèi)別 參數(shù) 描述
bind(object) instance object: 擁有這個(gè)方法的對(duì)象 返回預(yù)先綁定在擁有該函數(shù)(=方法)的對(duì)象上的函數(shù)實(shí)例, 返回的方法將和原來(lái)的方法具有相同的參數(shù)。
bindAsEventListener(object) instance object: 擁有這個(gè)方法的對(duì)象 返回預(yù)先綁定在擁有該函數(shù)(=方法)的對(duì)象上的函數(shù)實(shí)例, 返回的方法將把當(dāng)前的事件對(duì)象作為它的參數(shù)。
讓我們看看這些擴(kuò)展的具體例子。
<input type=checkbox id=myChk value=1> Test?
<script>
//declaring the class
var CheckboxWatcher = Class.create();
//defining the rest of the class implmentation
CheckboxWatcher.prototype = {
initialize: function(chkBox, message) {
this.chkBox = $(chkBox);
this.message = message;
//assigning our method to the event
this.chkBox.onclick = this.showMessage.bindAsEventListener(this);
},
showMessage: function(evt) {
alert(this.message + ' (' + evt.type + ')');
}
};
var watcher = new CheckboxWatcher('myChk', 'Changed');
</script>4.5. 對(duì) String 類(lèi)的擴(kuò)展
Table 4. String 類(lèi)的擴(kuò)展
方法 類(lèi)別 參數(shù) 描述
stripTags() instance (none) 返回一個(gè)把所有的HTML或XML標(biāo)記都移除的字符串。
escapeHTML() instance (none) 返回一個(gè)把所有的HTML標(biāo)記回避掉的字符串。
unescapeHTML() instance (none) 和 escapeHTML()相反。
4.6. 對(duì) document DOM 對(duì)象的擴(kuò)展
Table 5. document DOM 對(duì)象的擴(kuò)展
方法 類(lèi)別 參數(shù) 描述
getElementsByClassName(className) instance className: 關(guān)聯(lián)在元素上的CSS類(lèi)名 返回給定的具有相同的CSS類(lèi)名的所有元素。
4.7. 對(duì) Event 對(duì)象的擴(kuò)展
Table 6. Event 對(duì)象的擴(kuò)展
屬性 類(lèi)型 描述
KEY_BACKSPACE Number 8: 常量,退格(Backspace)鍵的代碼。
KEY_TAB Number 9: 常量,Tab鍵的代碼。
KEY_RETURN Number 13: 常量,回車(chē)鍵的代碼。
KEY_ESC Number 27: 常量, Esc鍵的代碼。
KEY_LEFT Number 37: 常量,左箭頭鍵的代碼。
KEY_UP Number 38: 常量,上箭頭鍵的代碼。
KEY_RIGHT Number 39: 常量,右箭頭鍵的代碼。
KEY_DOWN Number 40: 常量,下箭頭鍵的代碼。
KEY_DELETE Number 46: 常量,刪除(Delete)鍵的代碼。
observers: Array 緩存的觀察者的列表,這個(gè)對(duì)象內(nèi)部具體實(shí)現(xiàn)的一部分。
Table 7. Event 對(duì)象的擴(kuò)展
方法 類(lèi)別 參數(shù) 描述
element(event) static event: 事件對(duì)象 返回引發(fā)這個(gè)事件的元素。
isLeftClick(event) static event: 事件對(duì)象 如果鼠標(biāo)左鍵單擊返回true。
pointerX(event) static event: 事件對(duì)象 返回在頁(yè)面上x(chóng)坐標(biāo)。
pointerY(event) static event: 事件對(duì)象 返回在頁(yè)面上y坐標(biāo)。
stop(event) static event: 事件對(duì)象 用這個(gè)方法來(lái)中止事件的默認(rèn)行為來(lái)使事件的傳播停止。
findElement(event, tagName) static event: 事件對(duì)象, tagName: 指定標(biāo)記的名字 向 DOM 樹(shù)的上位查找,找到第一個(gè)給定標(biāo)記名稱(chēng)的元素, 從這個(gè)元素開(kāi)始觸發(fā)事件。
observe (element, name, observer, useCapture) static element: 對(duì)象或者對(duì)象id, name: 事件名 (如 'click', 'load', etc), observer: 處理這個(gè)事件的方法, useCapture: 如果true, 在捕捉到事件的階段處理事件 那么如果 false在bubbling 階段處理。 加入一個(gè)處理事件的方法。
stopObserving(element, name, observer, useCapture) static element: 對(duì)象或者對(duì)象id, name: 事件名 (如 'click', 'load', etc), observer: 處理這個(gè)事件的方法, useCapture: 如果true, 在捕捉到事件的階段處理事件 那么如果 false在bubbling 階段處理。 刪除一個(gè)處理實(shí)踐的方法。
_observeAndCache( element, name, observer, useCapture) static 私有方法,不用管它。
unloadCache() static (none) 私有方法,不用管它。清除內(nèi)存中的多有觀察著緩存。
讓我們看看怎樣用這個(gè)對(duì)象加入處理 window 對(duì)象的load事件的處理方法。
<script>
Event.observe(window, 'load', showMessage, false);
function showMessage() {
alert('Page loaded.');
}
</script>4.8. 在 prototype.js中定義的新對(duì)象和類(lèi)
另一個(gè)這個(gè)程序包幫助你的地方就是提供許多既支持面向?qū)ο笤O(shè)計(jì)理念又有共通功能的許多對(duì)象。
4.9. PeriodicalExecuter 對(duì)象
這個(gè)對(duì)象提供一定間隔時(shí)間上重復(fù)調(diào)用一個(gè)方法的邏輯。
Table 8. PeriodicalExecuter 對(duì)象
方法 類(lèi)別 參數(shù) 描述
[ctor](callback, interval) constructor callback: 沒(méi)有參數(shù)的方法, interval: 秒數(shù) 創(chuàng)建這個(gè)對(duì)象的實(shí)例將會(huì)重復(fù)調(diào)用給定的方法。
Table 9. PeriodicalExecuter 對(duì)象
屬性 類(lèi)型 描述
callback Function() 被調(diào)用的方法,該方法不會(huì)被傳入?yún)?shù)。
frequency Number 以秒為單位的間隔。
currentlyExecuting Boolean 表示這個(gè)方法是否正在執(zhí)行。
4.10. Prototype 對(duì)象
Prototype 沒(méi)有太重要的作用,只是聲明了該程序包的版本 。
Table 10. The Prototype object
屬性 類(lèi)型 描述
Version String 包的版本。
emptyFunction Function() 空方法對(duì)象。
4.11. Class 對(duì)象
在這個(gè)程序包中 Class 對(duì)象在聲明其他的類(lèi)時(shí)候被用到 。用這個(gè)對(duì)象聲明類(lèi)使得新類(lèi)支持 initialize() 方法,他起構(gòu)造方法的作用。
看下面的例子
//declaring the class
var MySampleClass = Class.create();
//defining the rest of the class implmentation
MySampleClass.prototype = {
initialize: function(message) {
this.message = message;
},
showMessage: function(ajaxResponse) {
alert(this.message);
}
};
//now, let's instantiate and use one object
var myTalker = new MySampleClass('hi there.');
myTalker.showMessage(); //displays alertTable 11. Class 對(duì)象
方法 類(lèi)別 參數(shù) 描述
create(*) instance (any) 定義新類(lèi)的構(gòu)造方法。
4.12. Ajax 對(duì)象
這個(gè)對(duì)象被用作其他提供AJAX功能的類(lèi)的根對(duì)象。
Table 12. Ajax 對(duì)象
方法 類(lèi)別 參數(shù) 描述
getTransport() instance (none) 返回新的XMLHttpRequest 對(duì)象。
4.13. Ajax.Base 類(lèi)
這個(gè)類(lèi)是其他在Ajax對(duì)象中定義的類(lèi)的基類(lèi)。
Table 13. Ajax.Base 類(lèi)
方法 類(lèi)別 參數(shù) 描述
setOptions(options) instance options: AJAX 選項(xiàng) 設(shè)定AJAX操作想要的選項(xiàng)。
responseIsSuccess() instance (none) 返回 true 如果AJAX操作成功,否則為 false 。
responseIsFailure() instance (none) 與 responseIsSuccess() 相反。
4.14. Ajax.Request 類(lèi)
繼承自 Ajax.Base
封裝 AJAX 操作
Table 14. Ajax.Request 類(lèi)
屬性 類(lèi)型 類(lèi)別 描述
Events Array static 在AJAX操作中所有可能報(bào)告的事件/狀態(tài)的列表。這個(gè)列表包括: 'Uninitialized', 'Loading', 'Loaded', 'Interactive', 和 'Complete'。
transport XMLHttpRequest instance 攜帶AJAX操作的 XMLHttpRequest 對(duì)象。
Table 15. Ajax.Request 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor] (url, options) constructor url: 請(qǐng)求的url, options: AJAX 選項(xiàng) 創(chuàng)建這個(gè)對(duì)象的一個(gè)實(shí)例,它將在給定的選項(xiàng)下請(qǐng)求url。 重要:如果選擇的url受到瀏覽器的安全設(shè)置,他會(huì)一點(diǎn)作用也不起。 很多情況下,瀏覽器不會(huì)請(qǐng)求與當(dāng)前頁(yè)面不同主機(jī)(域名) 的url。 你最好只使用本地url來(lái)避免限制用戶(hù)配置他們的瀏覽器(謝謝Clay)
request(url) instance url: AJAX 請(qǐng)求的url 這個(gè)方法通常不會(huì)被外部調(diào)用。已經(jīng)在構(gòu)造方法中調(diào)用了。
setRequestHeaders() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 被這個(gè)對(duì)象自己調(diào)用來(lái)配置在HTTP請(qǐng)求要發(fā)送的HTTP報(bào)頭。
onStateChange() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 當(dāng)AJAX請(qǐng)求狀態(tài)改變的時(shí)候被這個(gè)對(duì)象自己調(diào)用。
respondToReadyState(readyState) instance readyState: 狀態(tài)數(shù)字 (1 到 4) 這個(gè)方法通常不會(huì)被外部調(diào)用。 當(dāng)AJAX請(qǐng)求狀態(tài)改變的時(shí)候被這個(gè)對(duì)象自己調(diào)用。
4.15. options 參數(shù)對(duì)象
AJAX操作中一個(gè)重要的部分就是 options 參數(shù)。 本質(zhì)上沒(méi)有options類(lèi)。任何對(duì)象都可以被傳入,只要帶有需要的屬性。通常會(huì)只為了AJAX調(diào)用創(chuàng)建匿名類(lèi)。
Table 16. options 參數(shù)對(duì)象
屬性 類(lèi)型 Default 描述
method Array 'post' HTTP 請(qǐng)求方式。
parameters String '' 在HTTP請(qǐng)求中傳入的url格式的值列表。
asynchronous Boolean true 指定是否做異步 AJAX 請(qǐng)求。
postBody String undefined 在HTTP POST的情況下,傳入請(qǐng)求體中的內(nèi)容。
requestHeaders Array undefined 和請(qǐng)求一起被傳入的HTTP頭部列表, 這個(gè)列表必須含有偶數(shù)個(gè)項(xiàng)目, 任何奇數(shù)項(xiàng)目是自定義的頭部的名稱(chēng), 接下來(lái)的偶數(shù)項(xiàng)目使這個(gè)頭部項(xiàng)目的字符串值。 例子:['my-header1', 'this is the value', 'my-other-header', 'another value']
onXXXXXXXX Function(XMLHttpRequest) undefined 在 AJAX請(qǐng)求中,當(dāng)相應(yīng)的事件/狀態(tài)形成的時(shí)候調(diào)用的自定義方法。 例如 var myOpts = {onComplete: showResponse, onLoaded: registerLoaded};. 這個(gè)方法將被傳入一個(gè)參數(shù), 這個(gè)參數(shù)是攜帶AJAX操作的 XMLHttpRequest對(duì)象。
onSuccess Function(XMLHttpRequest) undefined 當(dāng)AJAX請(qǐng)求成功完成的時(shí)候調(diào)用的自定義方法。 這個(gè)方法將被傳入一個(gè)參數(shù), 這個(gè)參數(shù)是攜帶AJAX操作的 XMLHttpRequest對(duì)象。
onFailure Function(XMLHttpRequest) undefined 當(dāng)AJAX請(qǐng)求完成但出現(xiàn)錯(cuò)誤的時(shí)候調(diào)用的自定義方法。 這個(gè)方法將被傳入一個(gè)參數(shù), 這個(gè)參數(shù)是攜帶AJAX操作的 XMLHttpRequest對(duì)象。
insertion Function(Object, String) null 為了把返回的文本注入到一個(gè)元素中而執(zhí)行的方法。 這個(gè)方法將被傳入兩個(gè)參數(shù),要被更新的對(duì)象并且只應(yīng)用于 Ajax.Updater的響應(yīng)文本 。
evalScripts Boolean undefined, false 決定當(dāng)響應(yīng)到達(dá)的時(shí)候是否執(zhí)行其中的腳本塊,只在 Ajax.Updater 對(duì)象中應(yīng)用。
decay Number undefined, 1 決定當(dāng)最后一次響應(yīng)和前一次響應(yīng)相同時(shí)在 Ajax.PeriodicalUpdater 對(duì)象中的減漫訪(fǎng)問(wèn)的次數(shù), 例如,如果設(shè)為2,后來(lái)的刷新和之前的結(jié)果一樣, 這個(gè)對(duì)象將等待2個(gè)設(shè)定的時(shí)間間隔進(jìn)行下一次刷新, 如果又一次一樣, 那么將等待4次,等等。 不設(shè)定這個(gè)只,或者設(shè)置為1,將避免訪(fǎng)問(wèn)頻率變慢。
4.16. Ajax.Updater 類(lèi)
繼承自 Ajax.Request
當(dāng)請(qǐng)求的url返回一段HTML而你想把它直接放置到頁(yè)面中一個(gè)特定的元素的時(shí)候被用到。 如果url的返回<script> 的塊并且想在接收到時(shí)就執(zhí)行它的時(shí)候也可以使用該對(duì)象。含有腳本的時(shí)候使用 evalScripts 選項(xiàng)。
Table 17. Ajax.Updater 類(lèi)
屬性 類(lèi)型 類(lèi)別 描述
ScriptFragment String static 可以判斷是否為腳本的正則表達(dá)式。
containers Object instance 這個(gè)對(duì)象包含兩個(gè)屬性:AJAX請(qǐng)求成功執(zhí)行的時(shí)候用到 containers.success , 否則的話(huà)用到 containers.failure 。
Table 18. Ajax.Updater 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor] (container, url, options) constructor container:可以是元素的id, 也可以是元素自己, 或者可以是帶有2個(gè)屬性的對(duì)象 - object.success AJAX請(qǐng)求成功的時(shí)候用到的元素(或者id) 否則用到object.failure 中設(shè)定的元素(或id) ,url: 請(qǐng)求的url, options: AJAX 選項(xiàng) 創(chuàng)建一個(gè)用給定的選項(xiàng)請(qǐng)求給定的url的一個(gè)實(shí)例。
updateContent () instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 當(dāng)響應(yīng)到達(dá)的時(shí)候,被這個(gè)對(duì)象自己調(diào)用。 它會(huì)用HTML更新適當(dāng)?shù)脑鼗蛘哒{(diào)用在 insertion 選項(xiàng)中傳入的方法-這個(gè)方法將被傳入兩個(gè)參數(shù), 被更新的元素和響應(yīng)文本。
4.17. Ajax.PeriodicalUpdater 類(lèi)
繼承自 Ajax.Base
這個(gè)類(lèi)重復(fù)生成并使用 Ajax.Updater 對(duì)象來(lái)刷新頁(yè)面中的一個(gè)元素。或者執(zhí)行 Ajax.Updater 可以執(zhí)行的其它任務(wù)。更多信息參照 Ajax.Updater 參考 。
Table 19. Ajax.PeriodicalUpdater 類(lèi)
屬性 類(lèi)型 類(lèi)別 描述
container Object instance 這個(gè)值將直接傳入Ajax.Updater的構(gòu)造方法。
url String instance 這個(gè)值將直接傳入Ajax.Updater的構(gòu)造方法。
frequency Number instance 兩次刷新之間的間隔 (不是頻率) ,以秒為單位。 默認(rèn)2秒。 This 當(dāng)調(diào)用 Ajax.Updater 對(duì)象的時(shí)候,這個(gè)數(shù)將和當(dāng)前的 decay 相乘。
decay Number instance 重負(fù)執(zhí)行任務(wù)的時(shí)候保持的衰敗水平。
updater Ajax.Updater instance 最后一次使用的 Ajax.Updater 對(duì)象
timer Object instance 通知對(duì)象該下一次更新時(shí)用到的JavaScript 計(jì)時(shí)器。
Table 20. Ajax.PeriodicalUpdater 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor] (container, url, options) constructor container:可以是元素的id, 也可以是元素自己, 或者可以是帶有2個(gè)屬性的對(duì)象 - object.success AJAX請(qǐng)求成功的時(shí)候用到的元素(或者id) 否則用到object.failure 中設(shè)定的元素(或id) ,url: 請(qǐng)求的url, options: AJAX 選項(xiàng) 創(chuàng)建一個(gè)用給定的選項(xiàng)請(qǐng)求給定的url的一個(gè)實(shí)例。
start() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 對(duì)象為了開(kāi)始周期性執(zhí)行任務(wù)的時(shí)候調(diào)用的方法。
stop() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 對(duì)象為了停止周期性執(zhí)行任務(wù)的時(shí)候調(diào)用的方法。
updateComplete() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 被當(dāng)前的 Ajax.Updater 使用,當(dāng)一次請(qǐng)求結(jié)束的時(shí)候,它被用作計(jì)劃下一次請(qǐng)求。
onTimerEvent() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。當(dāng)?shù)较乱淮胃聲r(shí)被內(nèi)部調(diào)用。
4.18. Element 對(duì)象
這個(gè)對(duì)象提供在操作DOM中元素時(shí)使用的功能性方法。
Table 21. Element 對(duì)象
方法 類(lèi)別 參數(shù) 描述
toggle(elem1 [, elem2 [, elem3 [...]]]) constructor elemN: 元素對(duì)象或id 切換每一個(gè)傳入元素的可視性。
hide(elem1 [, elem2 [, elem3 [...]]]) instance elemN: 元素對(duì)象或id 用設(shè)定它的 style.display 為 'none'來(lái)隱藏每個(gè)傳入的元素。
show(elem1 [, elem2 [, Slem3 [...]]]) instance elemN: 元素對(duì)象或id 用設(shè)定它的 style.display 為 ''來(lái)顯示每個(gè)傳入的元素。
remove(element) instance element: 元素對(duì)象或id 從document對(duì)象中刪除指定的元素。
getHeight(element) instance element: 元素對(duì)象或id 返回元素的 offsetHeight 。
addClassName( element, className) instance element: 元素對(duì)象或id, className: CSS類(lèi)名 向元素的類(lèi)名中加入給定的類(lèi)名。
hasClassName( element, className) instance element: 元素對(duì)象或id, className: CSS類(lèi)名 返回 true 如果元素的類(lèi)名中含有給定的類(lèi)名
removeClassName( element, className) instance element: 元素對(duì)象或id, className: CSS類(lèi)名 從元素的類(lèi)名中刪除給定的類(lèi)名。
cleanWhitespace( element ) instance element: 元素對(duì)象或id 刪除該元素的所有只含有空格的子節(jié)點(diǎn)。
4.19. Abstract 對(duì)象
這個(gè)對(duì)象是這個(gè)程序包中其他類(lèi)的根。它沒(méi)有任何屬性和方法。在這個(gè)對(duì)象中定義的類(lèi)可以被視為傳統(tǒng)的抽象類(lèi)。
4.20. Abstract.Insertion 類(lèi)
這個(gè)類(lèi)被用作其他提供動(dòng)態(tài)內(nèi)容插入功能的類(lèi)的基類(lèi),它像一個(gè)抽象類(lèi)一樣被使用。
Table 22. Abstract.Insertion 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor](element, content) constructor element: 元素對(duì)象或id, content: 被插入的HTML 創(chuàng)建一個(gè)可以幫助插入動(dòng)態(tài)內(nèi)容的對(duì)象。
Table 23. Abstract.Insertion 類(lèi)
屬性 類(lèi)型 類(lèi)別 描述
adjacency String static, parameter 這個(gè)參數(shù)指定相對(duì)于給定元素,內(nèi)容將被放置的位置。 可能的值是: 'beforeBegin', 'afterBegin', 'beforeEnd', 和 'afterEnd'.
element Object instance 與插入物做參照元素對(duì)象。
content String instance 被插入的 HTML 。
4.21. Insertion 對(duì)象
這個(gè)對(duì)象是其他類(lèi)似功能的根。它沒(méi)有任何屬性和方法。在這個(gè)對(duì)象中定義的類(lèi)仍然可以被視為傳統(tǒng)的抽象類(lèi)。
4.22. Insertion.Before 類(lèi)
繼承自 Abstract.Insertion
在給定元素開(kāi)始標(biāo)記的前面插入HTML。
Table 24. Insertion.Before 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor](element, content) constructor element: 元素對(duì)象或id, content: 被插入的HTML 繼承自 Abstract.Insertion. 創(chuàng)建一個(gè)可以幫助插入動(dòng)態(tài)內(nèi)容的對(duì)象。
下面的代碼
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Before('person', 'Chief '); </script>將把 HTML 變?yōu)?br />
<br>Hello, Chief <span id="person" style="color:red;">Wiggum. How's it going?</span>4.23. Insertion.Top 類(lèi)
繼承自 Abstract.Insertion
在給定元素第一個(gè)子節(jié)點(diǎn)位置插入 HTML。內(nèi)容將位于元素的開(kāi)始標(biāo)記的緊后面。
Table 25. Insertion.Top 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor](element, content) constructor element: 元素對(duì)象或id, content: 被插入的HTML 繼承自 Abstract.Insertion. 創(chuàng)建一個(gè)可以幫助插入動(dòng)態(tài)內(nèi)容的對(duì)象。
下面的代碼
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Top('person', 'Mr. '); </script>將把 HTML 變?yōu)?br />
<br>Hello, <span id="person" style="color:red;">Mr. Wiggum. How's it going?</span>4.24. Insertion.Bottom 類(lèi)
繼承自 Abstract.Insertion
在給定元素最后一個(gè)子節(jié)點(diǎn)位置插入 HTML。內(nèi)容將位于元素的結(jié)束標(biāo)記的緊前面。
Table 26. Insertion.Bottom 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor](element, content) constructor element: 元素對(duì)象或id, content: 被插入的HTML 繼承自 Abstract.Insertion. 創(chuàng)建一個(gè)可以幫助插入動(dòng)態(tài)內(nèi)容的對(duì)象。
下面的代碼
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Bottom('person', " What's up?"); </script>將把 HTML 變?yōu)?br />
< br>Hello, <span id="person" style="color:red;">Wiggum. How's it going? What's up?</span>4.25. Insertion.After 類(lèi)
繼承自 Abstract.Insertion
在給定元素結(jié)束標(biāo)記的后面插入HTML。
Table 27. Insertion.After 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor](element, content) constructor element: 元素對(duì)象或id, content: 被插入的HTML 繼承自 Abstract.Insertion. 創(chuàng)建一個(gè)可以幫助插入動(dòng)態(tài)內(nèi)容的對(duì)象。
下面的代碼
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.After('person', ' Are you there?'); </script>將把 HTML 變?yōu)?br />
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span> Are you there?4.26. Field 對(duì)象
這個(gè)對(duì)象提供操作表單中的輸入項(xiàng)目的功能性方法。
Table 28. Field 對(duì)象
方法 類(lèi)別 參數(shù) 描述
clear(field1 [, field2 [, field3 [...]]]) instance fieldN: 元素對(duì)象或id 清除傳入表單中項(xiàng)目元素的值。
present(field1 [, field2 [, field3 [...]]]) instance fieldN: 元素對(duì)象或id 只有在所有的表單項(xiàng)目都不為空時(shí)返回 true 。
focus(field) instance fieldN: 元素對(duì)象或id 移動(dòng)焦點(diǎn)到給定的表單項(xiàng)目。
select(field) instance fieldN: 元素對(duì)象或id 選擇支持項(xiàng)目值選擇的表單項(xiàng)目的值。
activate(field) instance fieldN: 元素對(duì)象或id 移動(dòng)焦點(diǎn)并且選擇支持項(xiàng)目值選擇的表單項(xiàng)目的值。
4.27. Form 對(duì)象
這個(gè)對(duì)象提供操作表單和他們的輸入項(xiàng)目的功能性方法。
Table 29. Form 對(duì)象
方法 類(lèi)別 參數(shù) 描述
serialize(form) instance form: 表單元素或id 返回url參數(shù)格式的項(xiàng)目名和值的列表, 如'field1=value1&field2=value2&field3=value3'。
getElements(form) instance form: 表單元素或id 返回包含所有在表單中輸入項(xiàng)目的 Array 對(duì)象。
getInputs (form [, typeName [, name]]) instance form: 表單元素或id, typeName: 輸入項(xiàng)目的類(lèi)型, name: 輸入項(xiàng)目的名稱(chēng) 返回一個(gè) Array 包含所有在表單中的 <input> 元素。 另外, 這個(gè)列表可以對(duì)元素的類(lèi)型或名字屬性進(jìn)行過(guò)濾。
disable(form) instance form: 表單元素或id 使表單中的所有輸入項(xiàng)目無(wú)效。
enable(form) instance form: 表單元素或id 使表單中的所有輸入項(xiàng)目有效。
focusFirstElement(form) instance form: 表單元素或id 激活第一個(gè)表單中可視的,有效的輸入項(xiàng)目。
reset(form) instance form: 表單元素或id 重置表單。和調(diào)用表單對(duì)象的 reset() 方法一樣。
4.28. Form.Element 對(duì)象
這個(gè)對(duì)象提供表單對(duì)象中的可視和非可視元素的功能性方法。
Table 30. Form.Element 對(duì)象
方法 類(lèi)別 參數(shù) 描述
serialize(element) instance element: 表單元素或id 返回元素的 名稱(chēng)=值 對(duì), 如 'elementName=elementValue'。
getValue(element) instance element: 表單元素或id 返回元素的值。
4.29. Form.Element.Serializers 對(duì)象
這個(gè)對(duì)象提供了內(nèi)部使用的用來(lái)協(xié)助解析出表單元素的當(dāng)前值功能性方法。
Table 31. Form.Element.Serializers 對(duì)象
方法 類(lèi)別 參數(shù) 描述
inputSelector (element) instance element: 一個(gè)帶有checked屬性的表單元素或id, 如 radio 或 checkbox。 返回帶有元素名稱(chēng)和值的 Array , 如 ['elementName', 'elementValue']
textarea(element) instance element: 一個(gè)帶有value屬性的表單元素或id, 如 textbox, button 或 password 項(xiàng)目。 返回帶有元素名稱(chēng)和值的 Array , 如 ['elementName', 'elementValue']
select(element) instance element: 一個(gè)<select> 元素對(duì)象或id。 返回帶有元素名稱(chēng)和所有被選擇的選項(xiàng)的值或文本的 Array , 如 ['elementName', 'selOpt1 selOpt4 selOpt9']
4.30. Abstract.TimedObserver 類(lèi)
這個(gè)類(lèi)是用于其它監(jiān)聽(tīng)一個(gè)元素的值(或者任何類(lèi)中涉及的屬性)變化的類(lèi)的基類(lèi),這個(gè)類(lèi)像一個(gè)抽象類(lèi)一樣被使用。
子類(lèi)可以被創(chuàng)建來(lái)監(jiān)聽(tīng)如輸入項(xiàng)目值,或style屬性,或表格的行數(shù),或者其他任何對(duì)跟蹤變化相關(guān)的東西。
子類(lèi)必須實(shí)現(xiàn)這個(gè)方法來(lái)決定什么才是被監(jiān)聽(tīng)的元素的當(dāng)前值。
Table 32. Abstract.TimedObserver 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor](element, frequency, callback) constructor element: 元素對(duì)象或id, frequency: 以秒為單位的間隔, callback: 當(dāng)元素改變的時(shí)候調(diào)用的方法。 創(chuàng)建一個(gè)監(jiān)聽(tīng)元素的對(duì)象。
registerCallback() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 被這個(gè)對(duì)象自己調(diào)用來(lái)開(kāi)始監(jiān)聽(tīng)那個(gè)元素。
onTimerEvent() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 被這個(gè)對(duì)象自己調(diào)用來(lái)周期性的檢查那個(gè)元素。
Table 33. Abstract.TimedObserver 類(lèi)
屬性 類(lèi)型 描述
element Object 被監(jiān)聽(tīng)的元素對(duì)象。
frequency Number 每次檢查中的以秒為單位的時(shí)間間隔。
callback Function(Object, String) 只要元素改變這個(gè)方法就會(huì)被調(diào)用。 會(huì)接收到元素對(duì)象和新值作為參數(shù)。
lastValue String 元素被核實(shí)的最后一個(gè)值。
4.31. Form.Element.Observer 類(lèi)
繼承自 Abstract.TimedObserver
Abstract.TimedObserver 的一個(gè)實(shí)現(xiàn)類(lèi)用來(lái)監(jiān)聽(tīng)表單輸入項(xiàng)目的值的變化。當(dāng)你想監(jiān)聽(tīng)一個(gè)沒(méi)有帶報(bào)告值變化事件的元素的時(shí)候使用這個(gè)類(lèi)。否則的話(huà)使用 Form.Element.EventObserver 類(lèi)代替。
Table 34. Form.Element.Observer 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor] (element, frequency, callback) constructor element: 元素對(duì)象或id, frequency: 以秒為單位的間隔, callback: 當(dāng)元素改變的時(shí)候調(diào)用的方法。 繼承自 Abstract.TimedObserver. 創(chuàng)建一個(gè)監(jiān)聽(tīng)元素值屬性的對(duì)象。
getValue() instance (none) 返回元素的值。
4.32. Form.Observer 類(lèi)
繼承自 Abstract.TimedObserver
Abstract.TimedObserver 的一個(gè)實(shí)現(xiàn)類(lèi)用來(lái)監(jiān)聽(tīng)表單中任何數(shù)據(jù)項(xiàng)的值的變化。當(dāng)你想監(jiān)聽(tīng)一個(gè)沒(méi)有帶報(bào)告值變化事件的元素的時(shí)候使用這個(gè)類(lèi)。 否則的話(huà)使用類(lèi)Form.EventObserver 代替。
Table 35. Form.Observer 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor](form, frequency, callback) constructor form: 表單對(duì)象或id, 繼承自 Abstract.TimedObserver. 創(chuàng)建一個(gè)監(jiān)聽(tīng)表單變化的對(duì)象。
getValue() instance (none) 返回所有表單數(shù)據(jù)的一系列值。
4.33. Abstract.EventObserver 類(lèi)
這個(gè)類(lèi)被用作其他一些類(lèi)的基類(lèi),這些類(lèi)具有在一個(gè)元素的值改變事件發(fā)生的時(shí)候執(zhí)行一個(gè)回調(diào)方法這樣的功能。
類(lèi) Abstract.EventObserver 的多個(gè)對(duì)象可以綁定到一個(gè)元素上,不是一個(gè)幫其他的擦出了,而是按照他們付給元素的順序執(zhí)行這些回調(diào)方法。
單選按鈕和復(fù)選框的觸發(fā)事件是 onclick ,而文本框和下拉列表框/下拉列表框的是 onchange 。
子類(lèi)必須實(shí)現(xiàn)這個(gè)方法來(lái)決定什么才是被監(jiān)聽(tīng)的元素的當(dāng)前值。
Table 36. Abstract.EventObserver 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor](element, callback) constructor element: 元素對(duì)象或id, callback: 當(dāng)事件發(fā)生的時(shí)候調(diào)用的方法。 創(chuàng)建監(jiān)聽(tīng)元素的對(duì)象。
registerCallback() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 被對(duì)象調(diào)用來(lái)把自己綁定到元素的事件上。
registerFormCallbacks() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 被對(duì)象調(diào)用來(lái)把自己綁定到表單中的每一個(gè)數(shù)據(jù)項(xiàng)元素的事件上。
onElementEvent() instance (none) 這個(gè)方法通常不會(huì)被外部調(diào)用。 將被綁定到元素的事件上。
Table 37. Abstract.EventObserver 類(lèi)
屬性 類(lèi)型 描述
element Object 被監(jiān)聽(tīng)的元素對(duì)象。
callback Function(Object, String) 只要元素改變就調(diào)用的方法。會(huì)接收到元素對(duì)象和新值作為參數(shù)。
lastValue String 元素被核實(shí)的最后一個(gè)值。
4.34. Form.Element.EventObserver 類(lèi)
繼承自 Abstract.EventObserver
Abstract.EventObserver 的一個(gè)實(shí)現(xiàn)類(lèi),它在監(jiān)測(cè)到表單中數(shù)據(jù)項(xiàng)元素的值改變的相應(yīng)事件時(shí)候執(zhí)行一個(gè)回調(diào)方法。 如果元素沒(méi)有任何報(bào)告變化的事件,那么你可以使用 Form.Element.Observer 類(lèi)代替。
Table 38. Form.Element.EventObserver 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor](element, callback) constructor element: 元素對(duì)象或id, callback: 當(dāng)事件發(fā)生的時(shí)候調(diào)用的方法。 繼承自 Abstract.EventObserver。 創(chuàng)建一個(gè)監(jiān)聽(tīng)元素值屬性的對(duì)象。
getValue() instance (none) 返回元素的值。
4.35. Form.EventObserver 類(lèi)
繼承自 Abstract.EventObserver
Abstract.EventObserver 的一個(gè)實(shí)現(xiàn)類(lèi),監(jiān)聽(tīng)表單對(duì)象中包含的任何對(duì)象的任何變化,用元素的事件檢測(cè)值的變化。如果元素沒(méi)有任何報(bào)告變化的事件, 那么你可以使用Form.Observer 類(lèi)代替。
Table 39. Form.Element.EventObserver 類(lèi)
方法 類(lèi)別 參數(shù) 描述
[ctor](form, callback) constructor form: 元素對(duì)象或id, callback: 當(dāng)表單中任何數(shù)據(jù)項(xiàng)改變的時(shí)候調(diào)用的方法 繼承自 Abstract.EventObserver。 創(chuàng)建一個(gè)監(jiān)聽(tīng)元素值屬性的對(duì)象。
getValue() instance (none) 返回所有表單數(shù)據(jù)的一系列值。
4.36. Position 對(duì)象 (預(yù)備文檔)
這個(gè)對(duì)象提供許多和元素位置相關(guān)的方法。
Table 40. Position 對(duì)象 (預(yù)備文檔)
方法 類(lèi)別 參數(shù) 描述
prepare() instance (none) 調(diào)整 deltaX 和 deltaY 屬性來(lái)協(xié)調(diào)在滾動(dòng)位置中的變化。 記得在頁(yè)面滾動(dòng)之后的任何調(diào)用的withinIncludingScrolloffset 之前調(diào)用這個(gè)方法。
realOffset (element) instance element: 對(duì)象或id 返回這個(gè)元素的正確滾動(dòng)偏差的 Array 對(duì)象, 包括所有影響元素的滾動(dòng)偏差。結(jié)果數(shù)組類(lèi)似 [total_scroll_left, total_scroll_top]
cumulativeOffset(element) instance element: 對(duì)象或id 回這個(gè)元素的正確滾動(dòng)偏差的 Array 對(duì)象, 包含任何被放置的父元素強(qiáng)加偏差。結(jié)果數(shù)組類(lèi)似 [total_offset_left, total_offset_top]
within(element, x, y) instance element: 對(duì)象, x 和 y: 一個(gè)點(diǎn)的坐標(biāo) 測(cè)試給定的點(diǎn)的坐標(biāo)是否在給定的元素的外部矩形范圍之內(nèi)。
withinIncludingScrolloffsets(element, x, y) instance element: object, x and y: coordinates of a point
overlap (mode, element) instance mode: 'vertical' 或 'horizontal', element: 對(duì)象 在調(diào)用這個(gè)方法之前需要調(diào)用within() 。這個(gè)方法返回0.0到1.0之間的數(shù)字,來(lái)表示坐標(biāo)在元素重疊的分?jǐn)?shù)。 舉個(gè)例子,如果元素是一個(gè)邊長(zhǎng)是 100px的正方形的DIV,并且位于(300, 300), 然后 within(divSquare, 330, 330);overlap ('vertical', divSquare); 會(huì)返回 0.10,意思是那個(gè)點(diǎn)位于DIV頂部邊框以下 10% (30px) 的位置上。
clone(source, target) instance source: 元素對(duì)象或 id, target: 元素對(duì)象或id 改變目標(biāo)元素的大小尺寸和位置與源元素的相同。
如果你發(fā)現(xiàn)錯(cuò)誤,過(guò)失或信息不完全,或平淡無(wú)意義的東西,請(qǐng) 通知作者 ,作者會(huì)盡可能快的修正它,作者仍然在寫(xiě)其他沒(méi)寫(xiě)的類(lèi),來(lái)保持一致。 任何翻譯的過(guò)失,不足,詞不達(dá)意,表達(dá)含糊等請(qǐng)通知我,我會(huì)再加斟酌,找到合適的描述。
posted on 2007-09-28 10:40
lk 閱讀(172)
評(píng)論(0) 編輯 收藏 所屬分類(lèi):
ajax&js