JavaScriptでAOP(その2)
コメントで指摘のあった,addEventListenerを試す.ただこれ,IEが対応していないので,もう一方のattachEventを試した.
ちなみに,こんなコードになる(ウィーブしてる所以外は,前回と同じなので省略).
<script type="text/javascript"> var t1 = document.getElementById("t1"); t1.attachEvent("onblur", function() { alert("hello")}); </script>
あらま,すごく簡単.差し込む場所は,すでにあるイベントハンドラの後ろ.ただこれ,単にイベントハンドラを連鎖してるだけなので,afterアドバイスとは言えない.
なんで,こんな用途には向かないのよね(というか,そこまで求めちゃイケナイのだ).
<form action="http://www.google.com"> <input id="s1" type="submit" onclick="return confirm('yes/no')"> </form> <script type="text/javascript"> var s1 = document.getElementById("s1"); s1.attachEvent("onclick", function() { confirm("YES/NO") }); </script>
こうゆうのは,前回のヤツじゃないと無理ね.
<form action="http://www.google.com"> <input id="s1" type="submit" onclick="return confirm('yes/no')"> </form> <script type="text/javascript"> var aspect = function(invocation) { var result = invocation.proceed(); if (result == true) { result = confirm("YES/NO"); } return result; } var s1 = document.getElementById("s1"); Object.Aspect.around(s1, "onclick", aspect); </script>
ポイントカットの戻り値判定が"=="演算子じゃ,心許ないのであれば,"==="演算子を使うべきかも知れない...
要はナニしたいかが問題で,単純にイベントハンドラを後付けするだけなら,attachEventのほうが遙かに簡単なのだ.それはそれで,覚えていて損はない.
気になる点は,W3C的にはaddEventListenerが正しいらしいがIEが対応してない.その代替がattachEventってことらしいんだけど,これはFirefoxが知らないとで,微妙な位置づけ.
なんでクロスブラウザの事を気にする人は気をつけないとイケナイかもね.
#あたしゃ,IE限定だから気にもしないけど.:-D
→Javascript - Advanced event registration models