在處理 jQuery Mobile 時，因為是手機介面，所以常常需要透過綁定 scroll 事件來處理各種狀況，
一般通常是 scroll to HIDE 或 scroll to LOAD&SHOW
但某些情況有可能會導致重複綁定的問題，所以需要透過 namesapced 的 event 來解決，避免兩個相同的事件(但處理不同情況)互相干擾
例如:
某些頁面要在 scroll 時把元素 A 和 B 都隱藏:
$(document).on('scroll', function (event) {
//TODO: determine the length of scrollTop to hide element A
}
$(document).on('scroll', function (event) {
}
但有時候元素 A 和 B 的事件都是 global 使用的, 但其中某些頁面不處理 B:
$(document).on('scroll', function (event) {
//TODO: determine the length of scrollTop to hide element A
}
$(document).off('scroll');
當 off('bind') 時就會把 A 和 B 的 handler 都刪除了
所以必須引用 namespaced
$(document).on('scroll.typeA', function (event) {
//TODO: determine the length of scrollTop to hide element A
}
$(document).on('scroll.typeB', function (event) {
//TODO: determine the length of scrollTop to hide element B
}
這樣就可以單獨 off 一個元素不影響其他 handler 的綁定
$(document).off('scroll.typeA');
$(document).off('scroll.typeB');
btw. 可以透過 jquery 去檢查目前事件有哪些 handler
$._data(document, 'events');
// 例如：可以把 document 中 scroll 事件的 handler 都印出來
$._data(document, 'events').scroll.forEach(function(elem) {
console.log ( elem.handler.toString());
});
參考 api:
click demo:
