jQueryのbind、unbindみたいにnamespace使ってaddEventとかremoveEventできるやつ
jQueryのbindとunbindは超便利やなぁと思って、arguments.calleeじゃなくてもremoveEventできるようなやつ書いた。addEventListenerとremoveEventLisetenerにnamespace渡して管理できる的な。iOSで動けばいいからattachEventとdetachEventは入れてないです。
結局思いついたやり方でやって、jQueryちゃんと読んでないけど、やり方はこんな感じ?つまり絶賛勉強中。。
巡り巡ってElement.prototypeを断念、、ソース修正した。どうせならこっちの方が使いやすいかも。Elementのprototypeに差し込んだ
revision: gist: 904063
bindの使い方
一番ベーシック
普通のaddEventListenerと同じ
bind(hoge, type, func);
名前空間
名前空間使ってaddEventする(unbind用)
bind(hoge, type.namespace, func);
一括addEvent
複数のイベントを一括でaddEvent
bind(hoge, {
"click": func,
"dblclick": func
});
unbindの使い方
全てのイベントを解除
全部消える
unbind(hoge);
指定したtypeのイベントを解除
“click”にひもづいてるイベントが全部消える
unbind(hoge, type);
指定したtype.namespaceのイベントを解除
“click.unko”のイベントのみ消える
unbind(hoge, type.namespace);
なんかでも中途半端でところどころうまく動いてないかも。
/*
* bind, unbind
*
* @author : nori()
* @copyright : 5509(https://5509.me/)
* @license : The MIT License
* @modified : 2011-04-06 13:00
*
* HOW TO USE
* bind event : bind(elm, type, func) or bind(elm, {})
* bind event.name : bind(elm, type.name, func)
* unbind all events : unbind(elm)
* unbind events(type) : unbind(elm, type)
* unbind event.name : unbind(elm, type.name)
*/
YOURNAMESPACE.bind = function() {
var i, _a = arguments;
// 一括登録
if ( typeof _a[1] === "object" ) {
for ( i in _a[1] ) {
bindFunc(i, _a[1][i]);
}
// 単体登録
} else {
bindFunc(_a[1], _a[2]);
}
function bindFunc(type, func) {
var i;
type = type.split(" ");
for ( i = 0, l = type.length; i < l; i++ ) {
// 名前空間の指定がある場合
if ( type[i].indexOf(".") !== -1 ) {
type[i] = type[i].split(".");
_a[0]["bindedNamed"] = _a[0]["bindedNamed"] || {};
_a[0]["bindedNamed"][type[i][0]] = _a[0]["bindedNamed"][type[i][0]] || {};
_a[0]["bindedNamed"][type[i][0]][type[i][1]] = func;
_a[0].addEventListener(type[i][0], func, false);
// 名前空間の指定がない場合
} else {
_a[0]["binded"] = _a[0]["binded"] || {};
_a[0]["binded"][type] = _a[0]["binded"][type] || [];
_a[0]["binded"][type][_a[0]["binded"][type].length] = func;
_a[0].addEventListener(type[i], func, false);
}
}
}
}
YOURNAMESPACE.unbind = function(elm, type) {
var i = 0, c, d, bindedTypes, bindedEvents, bindedNamedEvents;
// typeがない場合は全削除
if ( !type ) {
// 名前空間無しのイベントを削除
if ( elm["binded"] ) {
bindedTypes = elm["binded"];
for ( c in bindedTypes ) {
bindedEvents = bindedTypes[c];
while ( bindedEvents[i] ) {
elm.removeEventListener(c, bindedEvents[i], false);
bindedEvents.splice(i, i + 1);
}
}
}
// 名前空間有りのイベントを削除
if ( !elm["bindedNamed"] ) return false;
bindedNamedEvents = elm["bindedNamed"];
for ( c in bindedNamedEvents ) {
for ( d in bindedNamedEvents[c] ) {
elm.removeEventListener(c, bindedNamedEvents[c][d], false);
}
delete bindedNamedEvents[c];
}
} else
// namespaceの指定がある場合は単体削除
if ( type.indexOf(".") !== -1 ) {
type = type.split(".");
elm.removeEventListener(type[0], elm["bindedNamed"][type[0]][type[1]], false);
// typeはあるけど名前空間の指定がない場合はtypeだけ削除
} else {
// 名前空間無しのイベントを削除
if ( elm["binded"] && elm["binded"][type] ) {
bindedEvents = elm["binded"][type];
while ( bindedEvents[i] ) {
elm.removeEventListener(type, bindedEvents[i], false);
bindedEvents.splice(i, i + 1);
}
}
// 名前空間有りのイベントを削除
if ( !elm["bindedNamed"] || !elm["bindedNamed"][type] ) return false;
bindedNamedEvents = elm["bindedNamed"][type];
for ( c in bindedNamedEvents ) {
elm.removeEventListener(type, bindedNamedEvents[c], false);
}
delete bindedNamedEvents;
}
}
Trackbacks: 0
- Trackback URL for this entry
- Listed below are links to weblogs that reference
- jQueryのbind、unbindみたいにnamespace使ってaddEventとかremoveEventできるやつ from 5509
Leave a comment