使用bootstrap模式在iframe中调用页面?

时间:2014-03-10 09:19:02

标签: javascript jquery twitter-bootstrap iframe bootstrap-modal

我使用this Bootsrap模式插件并在其中调用一些页面。当页面需要回发或重定向时,它不会发生在模态中,它会更改页面。所以我希望它在iframe中以boostrap模式显示页面。

这是我的模态功能。码;我应该如何修改iframe中的节目内容?

$.fn.modal.defaults.spinner = $.fn.modalmanager.defaults.spinner =
      '<div class="loading-spinner" style="width: 200px; margin-left: -100px;">' +
        '<div class="progress progress-striped active">' +
          '<div class="progress-bar" style="width: 100%;"></div>' +
        '</div>' +
      '</div>';

    $.fn.modalmanager.defaults.resize = true;

    var $modal = $('#ajax-modal');

    $('.modal-edit').on('click', function () {
        // create the backdrop and wait for next modal to be triggered
        $('body').modalmanager('loading');

        var edit = $(this).attr("data-id");
        setTimeout(function () {
        $modal.load('User.aspx?edit=' + edit + '', '', function () {
            $modal.modal();
        });
        }, 100);
    });

这是我的模态模态div:

  <div id="ajax-modal" class="modal fade" tabindex="-1" data-width="760" data-replace="true">
  </div>

1 个答案:

答案 0 :(得分:0)

试试这个;

    $('.modal-edit').on('click', function () {
            // create the backdrop and wait for next modal to be triggered
            $('body').modalmanager('loading');
            var edit = $(this).attr("data-id");
            setTimeout(function () {
                $modal.on('show', function () {
                    $('iframe').attr("src", 'Customer_User.aspx?edit=' + edit + '');
                });
                $modal.modal()
                //$modal.load('Customer_User.aspx?edit=' + edit + '', '', function () {
                //    $modal.modal();
                //});
            }, 100);
        });


<div id="ajax-modal" class="modal fade" tabindex="-1" data-width="760" >
                        <iframe ></iframe>
                    </div>