Javascript 如何使jQuery对话框模态化?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3945123/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 06:47:17  来源:igfitidea点击:

How to make jQuery dialog modal?

javascriptasp.netjqueryjquery-uimodal-dialog

提问by James123

I am using jQuery dialog in asp.net. It is working fine for me. The problem is when I open the dialog box, I can still work parent page functionality. I don't want that. Just dialog to modal and should not allow focus on parent page.

我在asp.net 中使用jQuery 对话框。它对我来说很好。问题是当我打开对话框时,我仍然可以使用父页面功能。我不想要那个。只是模态对话框,不应允许关注父页面。

window.onload = function onloadFunction() {

        //setup edit person dialog
     $('#uploadPic').dialog({
             autoOpen: false,
             draggable: true,
             title: "Upload Picture",
             open: function(type, data) {
                 $(this).parent().appendTo("form");
             }
         });
     }

Is there any way to make it modal? Or if lost focus on dialog box close it automatically?

有没有办法让它模态化?或者如果在对话框上失去焦点会自动关闭它?

Please help me out.

请帮帮我。

回答by Lorenzo

Use

$('#uploadPic').dialog({
         autoOpen: false,
         modal: true,
         draggable: true,
         title: "Upload Picture",
         open: function(type, data) {
             $(this).parent().appendTo("form");
         }
     });
 }

I have just added the modal option to your sample.

我刚刚在您的示例中添加了模态选项。

回答by Custodio

Read the documentation of JQuery Ui Dialog in: http://docs.jquery.com/UI/Dialog

阅读 JQuery Ui Dialog 的文档:http: //docs.jquery.com/UI/Dialog

Exist a Option called Modal, here is some samples from doc:

存在一个名为 Modal 的选项,这里是来自 doc 的一些示例:

Initialize a dialog with the modal option specified.

使用指定的模式选项初始化对话框。

$( ".selector" ).dialog({ modal: true });

Get or set the modal option, after init.

在 init 之后获取或设置模态选项。

//getter
var modal = $( ".selector" ).dialog( "option", "modal" );
//setter
$( ".selector" ).dialog( "option", "modal", true );