7

単一のモーダル ("#agenda-modal") が定義されたページを使用しています。トリガー (.agenda-item) がクリックされると、次のようなリモート コンテンツでこのモーダルが表示されます。

$("body").on("click", ".agenda-question", function(e){
  var url = <build my url here>;
  $("#agenda-modal").modal({
    remote: url
  });
});

これは問題なく動作します (.agenda-items は JavaScript 経由で追加されるため、$body.on をリッスンしています)。

モーダルが閉じられたら、ページの一部（モーダル内のフォームが変更する部分）をリロードしたい。だから私は使用しています：

$("#agenda-modal").on("hidden", function(){
  alert("hidden");
});

もちろん、すべてに包まれています

$(function() {...});

これは機能しますが、一度だけです。最初にページを読み込んでトリガーをクリックすると、モーダルが読み込まれ、モーダルを閉じるとアラートが発生します。同じトリガーをもう一度クリックすると、モーダルが再び表示されますが、今回はアラートを閉じても発生しません!

わかりませんが、これはリスナー - on("hidden", function...) - がもう「バインド」されていないためですか? .on は常にイベントをキャッチすると思っていましたか?

モーダルのコードは、Twitter からそのままです。

<div class="modal hide fade" id="agenda-modal">
  <div class="modal-body"></div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal">Close</button>
  </div>
</div>

何か案は？変更されたページの部分を更新できるように、モーダルが閉じるタイミングをキャッチしたいと本当に思っています。

ところでレールを使用していますが、それが重要かどうかはわかりません...

4

3 に答える 3

2

これは Bootstrap の既知の問題です

問題は、イベントが発生するたびにイベントを再追加する必要があることですが、遅延が発生します。

以下に例を示します。

function hiddenModal() {
    alert("hidden");
    setTimeout(function() {
        $("#agenda-modal").on("hidden", hiddenModal );
    }, 222);
}

$("#agenda-modal").on("hidden", hiddenModal );

これは別の質問に似ていますが、別の種類のイベントの場合:

于 2014-07-06T07:29:43.427 に答える
0

これを理解できませんでした-すべて問題ないように見えますが、レールパイプラインによってかなりの量の js が追加されているため、何かが私の js に干渉している可能性を排除できませんでした。

代わりに jquery のネイティブ モーダルを使用するようになりました。

于 2013-07-30T12:12:41.163 に答える