addEventListener()の引数の設定について

addEventListener()の引数の設定について で　keydown とclick どちらも設定したいのですが、そんなことは可能でしょうか?

No.3 ベストアンサー 回答者： yambejp 回答日時： 2017/07/13 17:52

>prototype.に定義しているのは、何か理由

documentがつかめればなんでもいいんです
一義的にdocumentがHTMLDocumentなのでそれを利用しました。
場合によってはprototypeではなく直接メソッドを作成することも可能です
機能拡張はprototypeで行えば同じレベルの要素については
同じ挙動をするようになるので便利です

たとえば、NodeListやHTMLCollectionなど

この回答へのお礼

ありがとうございます。てっきりprototype.に定義するのは、業界の掟のようなものかと思っていました。とても勉強になりました。こういったのは、購入した書籍にのっていないので、感謝します。

お礼日時：2017/07/13 23:02

No.2 回答者： yambejp 回答日時： 2017/07/13 12:22

たとえばこんな感じでどうでしょう？

<script>
HTMLDocument.prototype.addEventsListener=function(x,y,z){
var doc=this;
Array.prototype.map.call(x,function(i){
doc.addEventListener(i,y,z);
},doc);
}
document.addEventsListener(['click','keydown'],function(e){
console.log(e.type);
});
</script>

この回答へのお礼

自作ですね。すごいですね。ありがとうございます。
console.dir(HTMLDocument);で確認しましたが、prototype.に定義しているのは、何か理由があるのでしょうか?

お礼日時：2017/07/13 17:25

No.1 回答者： fujillin 回答日時： 2017/07/13 09:54

こんにちは

一つの要素に一つのリスナー設定のようです。
https://developer.mozilla.org/ja/docs/Web/API/Ev …


どうしても複数同時に設定なさりたいのであれば、自作するしかないでしょう。
　DOMElement.addEventListeners(types, listener [, useCapture])
のような考えで、設定時にはtypesを分解して設定するようにしておけばよいのでは？
　types.split(",").map(function(t){
　　element.addEventlistener(t, listener, useCapture);
　});
みたいな感じでしょうか。

まぁ、こんなことしなくても、記述のしようはあると思いますけれど・・・

この回答へのお礼

ありがとうございます。慣れてないので、Urlとても参考になります。自作についても勉強になります。

お礼日時：2017/07/13 17:21