0

我知道这个问题已经回答了很多次，但我的问题是不同的。

我正在使用启用 iframe 的引导模式扩展（dialog2 https://github.com/yorch/jquery-bootstrap-scripting）。我正在尝试在页面加载时加载模式。使用正常方法不起作用。

页面尝试加载模式，出现一个覆盖但没有模式，当我点击页面时

JS

$(window).load(function(){
    $('#test').modal('show');
});

$(document).ready(function() {
  $(".dialog-iframe").dialog2IFrame(    {
          height:900,
          closeOnOverlayClick: true, 
          closeOnEscape: true, 
          removeOnClose: true, 
          showCloseHandle: true,

    });
        focussed:true
        });

HTML 链接

<a id="test" href="'.$url.'/popupviewresponse/'.$responses->response_id.'/'.seoUrl($responses->title).'" onclick="return loaded;"  class="dialog-iframe desktop-iframe" title="'.ucfirst($responses->title).'" >'.ucfirst($responses->title).'</a>
4

1 回答 1

0

您使用哪个扩展来启用 dialog2 中的 iframe。我在以下位置找到了一个（或一些代码）：Setting iframe width via Javascript。我发现：https ://github.com/yorch/jquery-bootstrap-scripting/blob/master/lib/jquery.dialog2.iframe.js使用其中一些代码，我可以在页面加载时打开带有 iframe 的模式，请参阅：http://plnkr.co/kBad2fnPWsxOWvhhfYNu

   <button id="framedialog" href="http://www.streetart.nl/">Open</button>

此按钮包含要在 iframe 中的 href 属性中加载的 url。

加载 iframe，隐藏按钮并单击打开对话框：

 $('#framedialog').hide().dialog2IFrame();
 $('#framedialog').hide().trigger('click');

修改后的扩展：

/*  
* jQuery Dialog2 IFrame
* 
* Licensed under the MIT license 
* http://www.opensource.org/licenses/mit-license.php 
* 
* @version: 0.0.1 (09/06/2013)
* 
* @requires jQuery >= 1.4 
* 
* @requires jQuery.dialog2 plugin >= 1.1
* 
* @modified by Bass Jobsen (bass@w3masters.nl)
* @original author Jorge Barnaby (jorge.barnaby {at} gmail.com)
*/
(function ($) {

    /*
    * Shows a web page (using iframe) in a jQuery dialog2 (Bootstrap style).
    *
    */
    $.fn.dialog2IFrame = function (options) {
        options = $.extend({}, $.fn.dialog2IFrame.defaults, options);
        $(this).click(function (e) {
            e.preventDefault();
            var idDialogOuter = "dialog-iframe-outer";
            var $dialogOuter = $('#' + idDialogOuter).length ?
                $('#' + idDialogOuter) :
                $('<div id="' + idDialogOuter + '"></div>').hide().appendTo(document.body);
            var $dialogFrame = $('iframe', $dialogOuter).length ?
                $('iframe', dialogOuter) :
                $('<iframe frameborder="0" />').appendTo($dialogOuter);


            // Adds URL to iframe src
            $dialogFrame.attr('src', $(this).attr('href'));

            $dialogOuter.css('overflow', 'hidden').css('padding', '0').css('margin', '0');

            $dialogOuter.dialog2(
            {
                autoOpen: true,
                closeOnOverlayClick: options.closeOnOverlayClick,
                closeOnEscape: options.closeOnEscape,
                removeOnClose: true,
                showCloseHandle: options.showCloseHandle,
                initialLoadText: "Loading..."
            });

            var $dialog = $dialogOuter.parent();

            $dialog.addClass(options.additionalClass);

            // Removes footer if empty
            $footer = $dialog.find('.modal-footer');
            //console.log($footer.text().length);
            if ($footer.text().length == 0) {
                $footer.remove();
            }

            // Sets the iframe width and height to the same as the modal (must be done at the end)
            $dialogFrame.width($dialogOuter.width()).height($dialogOuter.height());
        });
    }

    $.fn.dialog2IFrame.defaults = {
        height: "900",
        additionalClass: "",
        // Appends &iframe=true to URL opened on IFrame
        appendParamUrl: false,
        // Reloads main page when modal is closed
        reloadOnClose: false,
        closeOnOverlayClick: false,
        closeOnEscape: false,
        showCloseHandle: false,
        close: function () {
            return true;
        }
    };
})(jQuery);
于 2013-06-09T14:44:02.243 回答