0

リンクに基づいてモーダルコンテンツを変更するためのこの非常に単純なjQueryスクリプトがあります。コード：

$('#facebook-friends').on('hidden', function () {
  $(this).removeData('modal');
});

次に、ボタンに基づいて、使用するコンテンツを制御できます。

<a href="facebook-frame.php" id="full-width" data-target="#facebook-friends" role="button" class="btn btn-primary" data-toggle="modal"><i class="icon-facebook"></i> Use Facebook</a>

それは完全に機能します！ただし、このファイル内にリンクがありfacebook-frame.php、外部ページがリロードされないように、すべてのアクションをモーダル内にとどめたいと考えています。

内部でこのソリューションを試しましfacebook-frame.phpたが、うまくいきません。

<a href="facebook-frame.php?all" data-target="#facebook-friends" role="button" class="btn btn-primary" data-toggle="modal">

これは私のメインページのモーダルです:

    <div class="modal fade hide" id="facebook-friends" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Inviter veninder fra Facebook</h3>
  </div>
  <div class="modal-body text-center">
    <p>Loading content...</p>
<p><IMG src="ajax-loader.gif"></p>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Luk</button>
  </div>
    </div>

非常に動的に見えるため、「コンテンツの読み込み」が特に気に入っています。

特別なコマンド/クラス/名前を内部のリンク/ボタンに割り当ててfacebook-frame.php、クリックすると一時的に「コンテンツの読み込み中」が表示され、その間に要求されたページ(href属性内)をロードする方法はありますか?

4

1 に答える 1

0

私が正しく理解していれば、内部ですべて（または特定のクラス）のクリックイベントをfacebook-frame.phpキャプチャできますか？<a><a>

$(document).on('click', '#facebook-friends a', function(e) {
    e.preventDefault();
    // show the "Loading content" message
    // load the content and whatever else you need to do
});

注: .on()jQuery 1.7+ が必要です。その前に、 を使用します.live()。

于 2013-03-09T22:26:34.353 に答える