0

次のような要素を含むページがあります。

<div id='things'>
    <div class='thing'>
        <div class='activator'>
            <span>Some text</span>
        </div>
    </div>
</div>

コードは次のようになります。

$('things').observe(click, function(event) {
    var e = event.element();
    if (e.match('.activator')) {
        doSomeStuffWith(e);
    } else if (e.match('.activator *')) {
        doSomeStuffWith(e.up('.activator');
    }
});

したがって、.activator またはその子要素のいずれかをクリックして、.activator で関数を呼び出したい場合、2 つの if 句を組み合わせる方法がないかどうか疑問に思っています。if (e.match('.class, .class *') { doStuff(e.upOrSelf('activator')); } のようなもの

upOrSelf メソッドで Element を拡張できると思います。ただし、可能であれば、非標準のカスタマイズは行いたくないです。

4

1 に答える 1

0

Prototype でのイベント委譲のより一般的な方法については、こちらを参照してください。ページの下には、ちょっとしたトリックを使用して目的を達成する実装があります。Event.delegate()ターゲット要素とその祖先を収集し、 を使用して、一致するすべての要素にイベント リスナーを適用しSelector.matchElementsます。

これよりも少し複雑ですが、簡略化したバージョン (未テスト) を次に示します。

$('things').observe('click', function(event) {
    var child = event.element();
    var ancestors = [child].concat(child.ancestors());
    Selector.matchElements(ancestors, '.activator').each(function(element) {
       doSomeStuffWith(element);
    });
})
于 2009-09-03T11:54:06.950 に答える