0

モーダル ダイアログ ボックスを作成しています。bodyまず、オーバーレイとして機能する iframe をタグに追加します。

<div class="modal-screen">
  <iframe src="javascript:false;"></iframe>
</div>

次に、ダイアログ ボックスを に追加しますbody。

<div class="dialog">
  <!-- various dialog related elements
</div>

ユーザーがオーバーレイをクリックしたときにダイアログを閉じたいと思います。問題は、オーバーレイに関連するイベントにバインドできないように見えることです。

私の JS を要約すると、基本的に私のダイアログ ビューにはinitialize、オーバーレイを準備するメソッドがあります。

initialize: function() {
  this.modal = $('<div class="modal-screen"><iframe src="javascript:false;"></iframe></div>')

  this.modal.on('click', function(e) {
    // this event never seems to fire
    console.log("hello");
  }
}

次に、必要なときにページにレンダリングします。オーバーレイをクリックしても何も表示されないhello..

render: function() {
  $('body').append(this.modal);
  // append other dialog content
  this
}
4

2 に答える 2

0

this.modal は単一の要素ではなく、DOM オブジェクトであるため、何もバインドできません。代わりに $('.modal-screen', this.modal) をバインドしてみてください。

于 2012-04-13T13:16:15.453 に答える
0

ここで iframe を使用する理由はありません。単にオーバーレイ divを構築し、クリックされたときにそれを削除します。

于 2012-04-13T13:27:36.477 に答える