Javascript 对话框自动高度无法正常工作

Question

我在 cshtml 中编写了这段代码，为我的 pdf 查看器模式创建一个容器:

<div id="form_modal_PDF" class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix" hidden="hidden" style="width: 100%; height: 100%;">
        <iframe id="form_load_PDF" class="IframeDialog" frameborder="1"
                style="width: 100%; height: 100%;" src="about:blank"></iframe>
</div>

我的js是:

function PopupPDF() {
    $('#form_modal_PDF').dialog({
        open: function () {
            $(this).closest(".ui-dialog")
            .find(".ui-button-text")
            .removeClass("ui-button-text");
        }
        , autoOpen: false
        , modal: true
        , draggable: false
        , resizable: false
        , show: 'slide'
        , hide: 'drop'
        , width: '80%'
        , height: 'auto'
        , beforeClose: function () {
            $('#form_load_PDF').attr('src', 'about:blank');
        }
    });
    $('#form_modal_PDF').dialog('open');

    $('#form_load_PDF').attr('src', '?test=' + encodeURIComponent("test.pdf"));
}

但是我的对话框 pdf 查看器的高度仅占屏幕的 10%

谢谢

Answer 1

您需要像这样更改 iframe 代码

<iframe id="form_load_PDF" class="IframeDialog" frameborder="1" style="overflow: hidden; height: 100%; width: 100%; position: absolute;" height="100%" width="100%"></iframe>