2月 09
たとえば、
HTML:
という構造で、readmeクラスをもつ要素に対し、いちいち onClick="..."とインラインで記述していくのは面倒だし、コードが汚くなる。そこで、prototype.jsの$$関数を用いて、
JavaScript:
-
var obj = $$('div.readme');
とやると、該当のオブジェクトを取得できるのは、prototype.jsの$$関数で書いてあるとおり。
そこに、イベントハンドラを割り当てる方法として、
Think ITにて、amachangが書いてる方法とほぼ同じなのだけれど、
JavaScript:
-
<div>hoge</div>
-
<div>hoge</div>
-
<div>hoge</div>
-
<script type="text/javascript">
-
var elements = $$('div');
-
var eventHandler = function() {
-
alert(' 要素がクリックされました');
-
};
-
-
for (var i = 0; i <elements.length; i ++) {
-
elements[i].observe('click', eventHandler);
-
}
-
</script>
自分は、こう書いてみた。
JavaScript:
-
var objs = $$("div.readme");
-
-
$A(objs).each(
-
function(o){
-
Event.observe(o, 'click', eventHandler, false);
-
}
-
);
$A関数で配列にアクセスし、イテレータを使う方法。
でも、正直、こっちのほうが楽だしわかりやすいな…
JavaScript:
-
for (var i = 0; i <elements.length; i ++) {
-
elements[i].observe('click', eventHandler);
-
}
最近（？）のJavaScriptは、１つの処理を行うのにたくさんの方法（記載法）があり、悩んでしまう。豆にリファレンスに目を通しておくしかないよなぁ、、
Popularity: 13% [?]