jquery - 同じページの複数のトリガーでの jQuery Keyup イベントの優先順位

Question

くだらないタイトルでごめんなさい。

すべてのページにポップアップできるお問い合わせフォームがあります。ユーザーは Esc を押してフォームを閉じることができます。正常に動作します。

<form id="contactForm" method="post" class="open" style="display: block;">
<input id="send" type="hidden" name="send">
<input type="hidden" value="/downloads/" name="_wp_http_referer">
<div id="main">
<input type="hidden" value="mailAction" name="action">
<a class="close" href="#">x</a>
</form>

    jQuery('a.close').click( function(e) {
      e.preventDefault();   
        jQuery('#overlay').fadeOut( 'slow');
        jQuery('#contactForm').removeClass('open').slideUp();
                                                                        });
    // When the "Escape" key is pressed, close the form
    jQuery('#contactForm').keydown( function( event ) {
        if ( event.which == 27 ) {
            jQuery('#contactForm a.close').trigger('click');
        }
    } );

わかった。現在、他のいくつかのページに、フォームではない別のドロップダウン div があります。ここでも、ユーザーは Esc を押してフォームを閉じることができます。そのために、キーアップをドキュメントにバインドする必要がありました。

jQuery(document).keyup( function( event ) {
    if ( event.which == 27 ) {
        if( jQuery('#modalpopup').is(':visible') )
          jQuery('#modalpopup .close').trigger('click');
        else if ( jQuery('#myplayer').is(':visible')  )
          jQuery('#myplayer .close').trigger('click');
        }
    } );

これらのページで何が起こるかというと、キーアップが #contactForm に「バブル」することはありません。私は何が欠けていますか？この 2 番目のハンドラーに keyup イベントを「渡す」ようにして、#contactForm にバブルアップさせる方法はありますか?

または、独立したキーアップ イベント ハンドラーを持つことができるように、他の div をダミー フォームでラップする必要がありますか?

ティア、

---JC