Question

我有一个使用IFRAME 上传文件的方案。我想要的是在成功上传文件后，我想关闭modal弹出窗口。但它不适用于我的情况。我尝试过如下

function CloseWindowFunction() {
        alert('PDF uploaded successfully');
        $('.modal-dialog').modal('toggle');
    }

另见html相同的

<div class="modal fade" id="dvFileUpload" tabindex="-1" role="dialog" aria-labelledby="dvFileUploadTitle" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLongTitle">File Upload</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body" data-keyboard="false">
                <iframe id="ifrmFileUpload" clientidmode="Static" runat="server" style="overflow: hidden; border: none" frameborder="0" scrolling="no"></iframe>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

那么，我应该如何关闭该模式弹出窗口，因为我的代码不能与toggle属性一起使用。

Answer 1

我认为你在iframe中调用CloseWindowFunction（）。如果是这样，请在父页面中创建一个函数say hideModalPopup：

function hideModalPopup(){
   $('.modal-dialog').modal('toggle'); 
   //OR - $('.modal-dialog').modal('hide');
}

像这样在CloseWindowFunction（）中调用上面的函数hideModalPopup（）。 CloseWindowFunction（）已编辑，请查看以下内容。

function CloseWindowFunction() {
        alert('PDF uploaded successfully');
        window.parent.hideModalPopup();
}

Answer 2

只需这样做

$('#dvFileUpload').modal('hide');

OR

$("#dvFileUpload .close").click();

OR

$('#dvFileUpload').removeClass('show');

Answer 3

也许你可以试试

function CloseWindowFunction() {
        alert('PDF uploaded successfully');
        $('#dvFileUpload').modal('hide');
    }

这里有一些模态事件的参考 https://getbootstrap.com/javascript/#modals-events

Answer 4

尝试添加具有第一个模态div的类，例如：

<div class="modal fade test-modal" id="dvFileUpload" tabindex="-1" role="dialog" aria-labelledby="dvFileUploadTitle" aria-hidden="true" data-backdrop="static" data-keyboard="false">

然后调用

$('.test-modal').modal('hide');

警报文件上传后关闭模式弹出窗口

4 个答案: