Chapter?2.?prototype.js參考
prototype.js 包中加入功能的一種途徑就是擴展已有的JavaScript 類。
Table?2.1.?Object 類的擴展
方法 |
類別 |
參數 |
描述 |
extend(destination, source)
|
static
|
destination: 任何對象, source: 任何對象 |
用從 source 到 destination復制所有屬性和方法的方式 來提供一種繼承機制。 |
extend(object)
|
instance
|
任何對象
|
用從傳入的 object 中復制所有屬性和方法的方式 來提供一種繼承機制。 |
Table?2.2.?Number 類的擴展
方法 |
類別 |
參數 |
描述 |
toColorPart()
|
instance
|
(none)
|
返回數字的十六進制描述, 當在HTML中轉換為RGB顏色組件到HTML中使用的顏色。 |
Table?2.3.?對 Function 類的擴展
方法 |
類別 |
參數 |
描述 |
bind(object)
|
instance
|
object: 擁有這個方法的對象 |
返回預先綁定在擁有該函數(=方法)的對象上的函數實例, 返回的方法將和原來的方法具有相同的參數。 |
bindAsEventListener(object)
|
instance
|
object: 擁有這個方法的對象 |
返回預先綁定在擁有該函數(=方法)的對象上的函數實例, 返回的方法將把當前的事件對象作為它的參數。 |
讓我們看看這些擴展的具體例子。
<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>
Table?2.4.?String 類的擴展
方法 |
類別 |
參數 |
描述 |
stripTags()
|
instance
|
(none)
|
返回一個把所有的HTML或XML標記都移除的字符串。 |
escapeHTML()
|
instance
|
(none)
|
返回一個把所有的HTML標記回避掉的字符串。 |
unescapeHTML()
|
instance
|
(none)
|
和 escapeHTML()相反。 |
2.6.?對 document DOM 對象的擴展
Table?2.5.?document DOM 對象的擴展
方法 |
類別 |
參數 |
描述 |
getElementsByClassName(className)
|
instance
|
className: 關聯在元素上的CSS類名 |
返回給定的具有相同的CSS類名的所有元素。 |
Table?2.6.?Event 對象的擴展
屬性 |
類型 |
描述 |
KEY_BACKSPACE
|
Number
|
8: 常量,退格(Backspace)鍵的代碼。 |
KEY_TAB
|
Number
|
9: 常量,Tab鍵的代碼。 |
KEY_RETURN
|
Number
|
13: 常量,回車鍵的代碼。 |
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
|
緩存的觀察者的列表,這個對象內部具體實現的一部分。
|
Table?2.7.?Event 對象的擴展
方法 |
類別 |
參數 |
描述 |
element(event)
|
static
|
event: 事件對象 |
返回引發這個事件的元素。 |
isLeftClick(event)
|
static
|
event: 事件對象 |
如果鼠標左鍵單擊返回true。 |
pointerX(event)
|
static
|
event: 事件對象 |
返回在頁面上x坐標。 |
pointerY(event)
|
static
|
event: 事件對象 |
返回在頁面上y坐標。 |
stop(event)
|
static
|
event: 事件對象 |
用這個方法來中止事件的默認行為來使事件的傳播停止。 |
findElement(event, tagName)
|
static
|
event: 事件對象, tagName: 指定標記的名字 |
向 DOM 樹的上位查找,找到第一個給定標記名稱的元素, 從這個元素開始觸發事件。 |
observe(element, name, observer, useCapture)
|
static
|
element: 對象或者對象id, name: 事件名 (如 'click', 'load', etc), observer: 處理這個事件的方法, useCapture: 如果true, 在捕捉到事件的階段處理事件 那么如果 false在bubbling 階段處理。 |
加入一個處理事件的方法。 |
stopObserving(element, name, observer, useCapture)
|
static
|
element: 對象或者對象id, name: 事件名 (如 'click', 'load', etc), observer: 處理這個事件的方法, useCapture: 如果true, 在捕捉到事件的階段處理事件 那么如果 false在bubbling 階段處理。 |
刪除一個處理實踐的方法。 |
_observeAndCache( element, name, observer, useCapture)
|
static
|
? |
私有方法,不用管它。 |
unloadCache()
|
static
|
(none)
|
私有方法,不用管它。清除內存中的多有觀察著緩存。 |
讓我們看看怎樣用這個對象加入處理 window 對象的load事件的處理方法。
<script>
Event.observe(window, 'load', showMessage, false);
function showMessage() {
alert('Page loaded.');
}
</script>
2.8.?在 prototype.js中定義的新對象和類
另一個這個程序包幫助你的地方就是提供許多既支持面向對象設計理念又有共通功能的許多對象。
2.9.?PeriodicalExecuter 對象
這個對象提供一定間隔時間上重復調用一個方法的邏輯。
Table?2.8.?PeriodicalExecuter 對象
方法 |
類別 |
參數 |
描述 |
[ctor](callback, interval)
|
constructor
|
callback: 沒有參數的方法, interval: 秒數 |
創建這個對象的實例將會重復調用給定的方法。 |
Table?2.9.?PeriodicalExecuter 對象
屬性 |
類型 |
描述 |
callback
|
Function()
|
被調用的方法,該方法不會被傳入參數。 |
frequency
|
Number
|
以秒為單位的間隔。 |
currentlyExecuting
|
Boolean
|
表示這個方法是否正在執行。 |
Prototype 沒有太重要的作用,只是聲明了該程序包的版本 。
Table?2.10.?The Prototype object
屬性 |
類型 |
描述 |
Version
|
String
|
包的版本。 |
emptyFunction
|
Function()
|
空方法對象。 |
在這個程序包中 Class 對象在聲明其他的類時候被用到 。用這個對象聲明類使得新類支持 initialize() 方法,他起構造方法的作用。
看下面的例子
//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 alert
Table?2.11.?Class 對象
方法 |
類別 |
參數 |
描述 |
create(*)
|
instance
|
(any)
|
定義新類的構造方法。 |
這個對象被用作其他提供AJAX功能的類的根對象。
Table?2.12.?Ajax 對象
方法 |
類別 |
參數 |
描述 |
getTransport()
|
instance
|
(none)
|
返回新的XMLHttpRequest 對象。 |
這個類是其他在Ajax對象中定義的類的基類。
Table?2.13.?Ajax.Base 類
方法 |
類別 |
參數 |
描述 |
setOptions(options)
|
instance
|
options: AJAX 選項 |
設定AJAX操作想要的選項。 |
responseIsSuccess()
|
instance
|
(none)
|
返回 true 如果AJAX操作成功,否則為 false 。 |
responseIsFailure()
|
instance
|
(none)
|
與 responseIsSuccess() 相反。 |
繼承自 Ajax.Base
封裝 AJAX 操作
Table?2.14.?Ajax.Request 類
屬性 |
類型 |
類別 |
描述 |
Events
|
Array
|
static
|
在AJAX操作中所有可能報告的事件/狀態的列表。這個列表包括: 'Uninitialized', 'Loading', 'Loaded', 'Interactive', 和 'Complete'。 |
transport
|
XMLHttpRequest
|
instance
|
攜帶AJAX操作的 XMLHttpRequest 對象。 |
Table?2.15.?Ajax.Request 類
方法 |
類別 |
參數 |
描述 |
[ctor](url, options)
|
constructor
|
url: 請求的url, options: AJAX 選項 |
創建這個對象的一個實例,它將在給定的選項下請求url。 重要:如果選擇的url受到瀏覽器的安全設置,他會一點作用也不起。 很多情況下,瀏覽器不會請求與當前頁面不同主機(域名)的url。 你最好只使用本地url來避免限制用戶配置他們的瀏覽器(謝謝Clay) |
request(url)
|
instance
|
url: AJAX 請求的url |
這個方法通常不會被外部調用。已經在構造方法中調用了。 |
setRequestHeaders()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 被這個對象自己調用來配置在HTTP請求要發送的HTTP報頭。 |
onStateChange()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 當AJAX請求狀態改變的時候被這個對象自己調用。 |
respondToReadyState(readyState)
|
instance
|
readyState: 狀態數字 (1 到 4) |
這個方法通常不會被外部調用。 當AJAX請求狀態改變的時候被這個對象自己調用。 |
AJAX操作中一個重要的部分就是 options 參數。 本質上沒有options類。任何對象都可以被傳入,只要帶有需要的屬性。通常會只為了AJAX調用創建匿名類。
Table?2.16.?options 參數對象
屬性 |
類型 |
Default |
描述 |
method
|
Array
|
'post'
|
HTTP 請求方式。 |
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,將避免訪問頻率變慢。 |
繼承自 Ajax.Request
當請求的url返回一段HTML而你想把它直接放置到頁面中一個特定的元素的時候被用到。 如果url的返回<script> 的塊并且想在接收到時就執行它的時候也可以使用該對象。含有腳本的時候使用 evalScripts 選項。
Table?2.17.?Ajax.Updater 類
屬性 |
類型 |
類別 |
描述 |
ScriptFragment
|
String
|
static
|
可以判斷是否為腳本的正則表達式。 |
containers
|
Object
|
instance
|
這個對象包含兩個屬性:AJAX請求成功執行的時候用到 containers.success , 否則的話用到 containers.failure 。 |
Table?2.18.?Ajax.Updater 類
方法 |
類別 |
參數 |
描述 |
[ctor](container, url, options)
|
constructor
|
container:可以是元素的id, 也可以是元素自己, 或者可以是帶有2個屬性的對象 - object.success AJAX請求成功的時候用到的元素(或者id) 否則用到object.failure 中設定的元素(或id) ,url: 請求的url, options: AJAX 選項 |
創建一個用給定的選項請求給定的url的一個實例。 |
updateContent()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 當響應到達的時候,被這個對象自己調用。 它會用HTML更新適當的元素或者調用在 insertion 選項中傳入的方法-這個方法將被傳入兩個參數, 被更新的元素和響應文本。 |
2.17.?Ajax.PeriodicalUpdater 類
繼承自 Ajax.Base
這個類重復生成并使用 Ajax.Updater 對象來刷新頁面中的一個元素。或者執行 Ajax.Updater 可以執行的其它任務。更多信息參照 Ajax.Updater 參考 。
Table?2.19.?Ajax.PeriodicalUpdater 類
屬性 |
類型 |
類別 |
描述 |
container
|
Object
|
instance
|
這個值將直接傳入Ajax.Updater的構造方法。 |
url
|
String
|
instance
|
這個值將直接傳入Ajax.Updater的構造方法。 |
frequency
|
Number
|
instance
|
兩次刷新之間的間隔 (不是頻率) ,以秒為單位。 默認2秒。 This 當調用 Ajax.Updater 對象的時候,這個數將和當前的 decay 相乘。 |
decay
|
Number
|
instance
|
重負執行任務的時候保持的衰敗水平。 |
updater
|
Ajax.Updater
|
instance
|
最后一次使用的 Ajax.Updater 對象 |
timer
|
Object
|
instance
|
通知對象該下一次更新時用到的JavaScript 計時器。 |
Table?2.20.?Ajax.PeriodicalUpdater 類
方法 |
類別 |
參數 |
描述 |
[ctor](container, url, options)
|
constructor
|
container:可以是元素的id, 也可以是元素自己, 或者可以是帶有2個屬性的對象 - object.success AJAX請求成功的時候用到的元素(或者id) 否則用到object.failure 中設定的元素(或id) ,url: 請求的url, options: AJAX 選項 |
創建一個用給定的選項請求給定的url的一個實例。 |
start()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 對象為了開始周期性執行任務的時候調用的方法。 |
stop()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 對象為了停止周期性執行任務的時候調用的方法。 |
updateComplete()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 被當前的 Ajax.Updater 使用,當一次請求結束的時候,它被用作計劃下一次請求。 |
onTimerEvent()
|
instance
|
(none)
|
這個方法通常不會被外部調用。當到下一次更新時被內部調用。 |
這個對象提供在操作DOM中元素時使用的功能性方法。
Table?2.21.?Element 對象
方法 |
類別 |
參數 |
描述 |
toggle(elem1 [, elem2 [, elem3 [...]]])
|
constructor
|
elemN: 元素對象或id |
切換每一個傳入元素的可視性。 |
hide(elem1 [, elem2 [, elem3 [...]]])
|
instance
|
elemN: 元素對象或id |
用設定它的 style.display 為 'none'來隱藏每個傳入的元素。 |
show(elem1 [, elem2 [, Slem3 [...]]])
|
instance
|
elemN: 元素對象或id |
用設定它的 style.display 為 ''來顯示每個傳入的元素。 |
remove(element)
|
instance
|
element: 元素對象或id |
從document對象中刪除指定的元素。 |
getHeight(element)
|
instance
|
element: 元素對象或id |
返回元素的 offsetHeight 。 |
addClassName( element, className)
|
instance
|
element: 元素對象或id, className: CSS類名 |
向元素的類名中加入給定的類名。 |
hasClassName( element, className)
|
instance
|
element: 元素對象或id, className: CSS類名 |
返回 true 如果元素的類名中含有給定的類名 |
removeClassName( element, className)
|
instance
|
element: 元素對象或id, className: CSS類名 |
從元素的類名中刪除給定的類名。 |
cleanWhitespace( element )
|
instance
|
element: 元素對象或id |
刪除該元素的所有只含有空格的子節點。 |
這個對象是這個程序包中其他類的根。它沒有任何屬性和方法。在這個對象中定義的類可以被視為傳統的抽象類。
2.20.?Abstract.Insertion 類
這個類被用作其他提供動態內容插入功能的類的基類,它像一個抽象類一樣被使用。
Table?2.22.?Abstract.Insertion 類
方法 |
類別 |
參數 |
描述 |
[ctor](element, content)
|
constructor
|
element: 元素對象或id, content: 被插入的HTML |
創建一個可以幫助插入動態內容的對象。 |
Table?2.23.?Abstract.Insertion 類
屬性 |
類型 |
類別 |
描述 |
adjacency
|
String
|
static, parameter
|
這個參數指定相對于給定元素,內容將被放置的位置。 可能的值是: 'beforeBegin', 'afterBegin', 'beforeEnd', 和 'afterEnd'. |
element
|
Object
|
instance
|
與插入物做參照元素對象。 |
content
|
String
|
instance
|
被插入的 HTML 。 |
這個對象是其他類似功能的根。它沒有任何屬性和方法。在這個對象中定義的類仍然可以被視為傳統的抽象類。
繼承自 Abstract.Insertion
在給定元素開始標記的前面插入HTML。
Table?2.24.?Insertion.Before 類
方法 |
類別 |
參數 |
描述 |
[ctor](element, content)
|
constructor
|
element: 元素對象或id, content: 被插入的HTML |
繼承自 Abstract.Insertion. 創建一個可以幫助插入動態內容的對象。 |
下面的代碼
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Before('person', 'Chief '); </script>
將把 HTML 變為
<br>Hello, Chief <span id="person" style="color:red;">Wiggum. How's it going?</span>
繼承自 Abstract.Insertion
在給定元素第一個子節點位置插入 HTML。內容將位于元素的開始標記的緊后面。
Table?2.25.?Insertion.Top 類
方法 |
類別 |
參數 |
描述 |
[ctor](element, content)
|
constructor
|
element: 元素對象或id, content: 被插入的HTML |
繼承自 Abstract.Insertion. 創建一個可以幫助插入動態內容的對象。 |
下面的代碼
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Top('person', 'Mr. '); </script>
將把 HTML 變為
<br>Hello, <span id="person" style="color:red;">Mr. Wiggum. How's it going?</span>
繼承自 Abstract.Insertion
在給定元素最后一個子節點位置插入 HTML。內容將位于元素的結束標記的緊前面。
Table?2.26.?Insertion.Bottom 類
方法 |
類別 |
參數 |
描述 |
[ctor](element, content)
|
constructor
|
element: 元素對象或id, content: 被插入的HTML |
繼承自 Abstract.Insertion. 創建一個可以幫助插入動態內容的對象。 |
下面的代碼
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Bottom('person', " What's up?"); </script>
將把 HTML 變為
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going? What's up?</span>
繼承自 Abstract.Insertion
在給定元素結束標記的后面插入HTML。
Table?2.27.?Insertion.After 類
方法 |
類別 |
參數 |
描述 |
[ctor](element, content)
|
constructor
|
element: 元素對象或id, content: 被插入的HTML |
繼承自 Abstract.Insertion. 創建一個可以幫助插入動態內容的對象。 |
下面的代碼
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.After('person', ' Are you there?'); </script>
將把 HTML 變為
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span> Are you there?
這個對象提供操作表單中的輸入項目的功能性方法。
Table?2.28.?Field 對象
方法 |
類別 |
參數 |
描述 |
clear(field1 [, field2 [, field3 [...]]])
|
instance
|
fieldN: 元素對象或id |
清除傳入表單中項目元素的值。 |
present(field1 [, field2 [, field3 [...]]])
|
instance
|
fieldN: 元素對象或id |
只有在所有的表單項目都不為空時返回 true 。 |
focus(field)
|
instance
|
fieldN: 元素對象或id |
移動焦點到給定的表單項目。 |
select(field)
|
instance
|
fieldN: 元素對象或id |
選擇支持項目值選擇的表單項目的值。 |
activate(field)
|
instance
|
fieldN: 元素對象或id |
移動焦點并且選擇支持項目值選擇的表單項目的值。 |
這個對象提供操作表單和他們的輸入項目的功能性方法。
Table?2.29.?Form 對象
方法 |
類別 |
參數 |
描述 |
serialize(form)
|
instance
|
form: 表單元素或id |
返回url參數格式的項目名和值的列表, 如'field1=value1&field2=value2&field3=value3'。 |
getElements(form)
|
instance
|
form: 表單元素或id |
返回包含所有在表單中輸入項目的 Array 對象。 |
getInputs(form [, typeName [, name]])
|
instance
|
form: 表單元素或id, typeName: 輸入項目的類型, name: 輸入項目的名稱 |
返回一個 Array 包含所有在表單中的 <input> 元素。 另外, 這個列表可以對元素的類型或名字屬性進行過濾。 |
disable(form)
|
instance
|
form: 表單元素或id |
使表單中的所有輸入項目無效。 |
enable(form)
|
instance
|
form: 表單元素或id |
使表單中的所有輸入項目有效。 |
focusFirstElement(form)
|
instance
|
form: 表單元素或id |
激活第一個表單中可視的,有效的輸入項目。 |
reset(form)
|
instance
|
form: 表單元素或id |
重置表單。和調用表單對象的 reset() 方法一樣。 |
這個對象提供表單對象中的可視和非可視元素的功能性方法。
Table?2.30.?Form.Element 對象
方法 |
類別 |
參數 |
描述 |
serialize(element)
|
instance
|
element: 表單元素或id |
返回元素的 名稱=值 對, 如 'elementName=elementValue'。 |
getValue(element)
|
instance
|
element: 表單元素或id |
返回元素的值。 |
2.29.?Form.Element.Serializers 對象
這個對象提供了內部使用的用來協助解析出表單元素的當前值功能性方法。
Table?2.31.?Form.Element.Serializers 對象
方法 |
類別 |
參數 |
描述 |
inputSelector(element)
|
instance
|
element: 一個帶有checked屬性的表單元素或id, 如 radio 或 checkbox。 |
返回帶有元素名稱和值的 Array , 如 ['elementName', 'elementValue'] |
textarea(element)
|
instance
|
element: 一個帶有value屬性的表單元素或id, 如 textbox, button 或 password 項目。 |
返回帶有元素名稱和值的 Array , 如 ['elementName', 'elementValue'] |
select(element)
|
instance
|
element: 一個<select> 元素對象或id。 |
返回帶有元素名稱和所有被選擇的選項的值或文本的 Array , 如 ['elementName', 'selOpt1 selOpt4 selOpt9'] |
2.30.?Abstract.TimedObserver 類
這個類是用于其它監聽一個元素的值(或者任何類中涉及的屬性)變化的類的基類,這個類像一個抽象類一樣被使用。
子類可以被創建來監聽如輸入項目值,或style屬性,或表格的行數,或者其他任何對跟蹤變化相關的東西。
子類必須實現這個方法來決定什么才是被監聽的元素的當前值。
Table?2.32.?Abstract.TimedObserver 類
方法 |
類別 |
參數 |
描述 |
[ctor](element, frequency, callback)
|
constructor
|
element: 元素對象或id, frequency: 以秒為單位的間隔, callback: 當元素改變的時候調用的方法。 |
創建一個監聽元素的對象。 |
registerCallback()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 被這個對象自己調用來開始監聽那個元素。 |
onTimerEvent()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 被這個對象自己調用來周期性的檢查那個元素。 |
Table?2.33.?Abstract.TimedObserver 類
屬性 |
類型 |
描述 |
element
|
Object
|
被監聽的元素對象。 |
frequency
|
Number
|
每次檢查中的以秒為單位的時間間隔。 |
callback
|
Function(Object, String)
|
只要元素改變這個方法就會被調用。 會接收到元素對象和新值作為參數。 |
lastValue
|
String
|
元素被核實的最后一個值。 |
2.31.?Form.Element.Observer 類
繼承自 Abstract.TimedObserver
Abstract.TimedObserver 的一個實現類用來監聽表單輸入項目的值的變化。當你想監聽一個沒有帶報告值變化事件的元素的時候使用這個類。否則的話使用 Form.Element.EventObserver類代替。
Table?2.34.?Form.Element.Observer 類
方法 |
類別 |
參數 |
描述 |
[ctor](element, frequency, callback)
|
constructor
|
element: 元素對象或id, frequency: 以秒為單位的間隔, callback: 當元素改變的時候調用的方法。 |
繼承自 Abstract.TimedObserver. 創建一個監聽元素值屬性的對象。 |
getValue()
|
instance
|
(none)
|
返回元素的值。 |
繼承自 Abstract.TimedObserver
Abstract.TimedObserver 的一個實現類用來監聽表單中任何數據項的值的變化。當你想監聽一個沒有帶報告值變化事件的元素的時候使用這個類。 否則的話使用類Form.EventObserver代替。
Table?2.35.?Form.Observer 類
方法 |
類別 |
參數 |
描述 |
[ctor](form, frequency, callback)
|
constructor
|
form: 表單對象或id, |
繼承自 Abstract.TimedObserver. 創建一個監聽表單變化的對象。 |
getValue()
|
instance
|
(none)
|
返回所有表單數據的一系列值。 |
2.33.?Abstract.EventObserver 類
這個類被用作其他一些類的基類,這些類具有在一個元素的值改變事件發生的時候執行一個回調方法這樣的功能。
類 Abstract.EventObserver 的多個對象可以綁定到一個元素上,不是一個幫其他的擦出了,而是按照他們付給元素的順序執行這些回調方法。
單選按鈕和復選框的觸發事件是 onclick ,而文本框和下拉列表框/下拉列表框的是 onchange 。
子類必須實現這個方法來決定什么才是被監聽的元素的當前值。
Table?2.36.?Abstract.EventObserver 類
方法 |
類別 |
參數 |
描述 |
[ctor](element, callback)
|
constructor
|
element: 元素對象或id, callback: 當事件發生的時候調用的方法。 |
創建監聽元素的對象。 |
registerCallback()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 被對象調用來把自己綁定到元素的事件上。 |
registerFormCallbacks()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 被對象調用來把自己綁定到表單中的每一個數據項元素的事件上。 |
onElementEvent()
|
instance
|
(none)
|
這個方法通常不會被外部調用。 將被綁定到元素的事件上。 |
Table?2.37.?Abstract.EventObserver 類
屬性 |
類型 |
描述 |
element
|
Object
|
被監聽的元素對象。 |
callback
|
Function(Object, String)
|
只要元素改變就調用的方法。會接收到元素對象和新值作為參數。 |
lastValue
|
String
|
元素被核實的最后一個值。 |
2.34.?Form.Element.EventObserver 類
繼承自 Abstract.EventObserver
Abstract.EventObserver 的一個實現類,它在監測到表單中數據項元素的值改變的相應事件時候執行一個回調方法。 如果元素沒有任何報告變化的事件,那么你可以使用 Form.Element.Observer類代替。
Table?2.38.?Form.Element.EventObserver 類
方法 |
類別 |
參數 |
描述 |
[ctor](element, callback)
|
constructor
|
element: 元素對象或id, callback: 當事件發生的時候調用的方法。 |
繼承自 Abstract.EventObserver。 創建一個監聽元素值屬性的對象。 |
getValue()
|
instance
|
(none)
|
返回元素的值。 |
2.35.?Form.EventObserver 類
繼承自 Abstract.EventObserver
Abstract.EventObserver 的一個實現類,監聽表單對象中包含的任何對象的任何變化,用元素的事件檢測值的變化。如果元素沒有任何報告變化的事件, 那么你可以使用Form.Observer類代替。
Table?2.39.?Form.Element.EventObserver 類
方法 |
類別 |
參數 |
描述 |
[ctor](form, callback)
|
constructor
|
form: 元素對象或id, callback: 當表單中任何數據項改變的時候調用的方法 |
繼承自 Abstract.EventObserver。 創建一個監聽元素值屬性的對象。 |
getValue()
|
instance
|
(none)
|
返回所有表單數據的一系列值。 |
這個對象提供許多和元素位置相關的方法。
Table?2.40.?Position 對象 (預備文檔)
方法 |
類別 |
參數 |
描述 |
prepare()
|
instance
|
(none)
|
調整 deltaX 和 deltaY 屬性來協調在滾動位置中的變化。 記得在頁面滾動之后的任何調用的withinIncludingScrolloffset 之前調用這個方法。 |
realOffset(element)
|
instance
|
element: 對象或id |
返回這個元素的正確滾動偏差的 Array 對象, 包括所有影響元素的滾動偏差。結果數組類似 [total_scroll_left, total_scroll_top] |
cumulativeOffset(element)
|
instance
|
element: 對象或id |
回這個元素的正確滾動偏差的 Array 對象, 包含任何被放置的父元素強加偏差。結果數組類似 [total_offset_left, total_offset_top] |
within(element, x, y)
|
instance
|
element: 對象, x 和 y: 一個點的坐標 |
測試給定的點的坐標是否在給定的元素的外部矩形范圍之內。 |
withinIncludingScrolloffsets(element, x, y)
|
instance
|
element: object, x and y: coordinates of a point |
? |
overlap(mode, element)
|
instance
|
mode: 'vertical' 或 'horizontal', element: 對象 |
在調用這個方法之前需要調用within() 。這個方法返回0.0到1.0之間的數字,來表示坐標在元素重疊的分數。 舉個例子,如果元素是一個邊長是100px的正方形的DIV,并且位于(300, 300), 然后 within(divSquare, 330, 330);overlap('vertical', divSquare); 會返回 0.10,意思是那個點位于DIV頂部邊框以下 10% (30px) 的位置上。 |
clone(source, target)
|
instance
|
source: 元素對象或 id, target: 元素對象或id |
改變目標元素的大小尺寸和位置與源元素的相同。 |
https://compdoc2cn.dev.java.net/prototype/html/prototype.js.cn.html