html - モーダルポップアップをブートストラップし、ページ変更も呼び出します

Question

Twitter Bootstrap を使用しており、モーダル ポップアップ ウィンドウを呼び出しています。よく働く。新規/変更ページも呼び出す機能を追加したいと思います。JS を使用しますか、それとも href に追加できますか?

<a data-toggle="modal" data-gallery="dining-room" href="#galleryModal">

Answer 1

href="#galleryModal" の代わりに、実際のリモート URL をポイントします。

<a data-toggle="modal" data-gallery="dining-room" 
  href="yourRemoteURL" data-target="#modal-Container">

これも試してください：

HTML:

<a href="yourRemoteURL" id="clicker" role="button" class="btn">Clicker</a>
<div id="modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>

JS:

$(function () {
    var $modal = $('#modal');
    $('#clicker').on('click', function (e) { /** Call the modal manually */
        e.preventDefault();
        var url = $(this).attr('href');
        $modal.html('<iframe width="100%" height="100%" frameborder="0" scrolling="no" allowtransparency="true" src="' + url + '"></iframe>');
        $modal.modal({
            show: true
        });
    });


    $modal.on('hide', function () {
        $modal.empty() /** Clean up */
    });
});

JSFiddle: http://jsfiddle.net/Cp3WY/