在jquery对话框而不是html上显示加载器div

Question

我的jquery对话框代码有一些输入字段和一个提交

onSubmit我显示加载器div

代码段是

$("#loading").show();
$("#loading-overlay").css("position", "fixed");
$("#loading-overlay").css("display", "block");

html是

<div id="loading-overlay">
</div>
<div id="loading">
    <span>Loading...</span>
</div>

这里的div的id使用一些css将样式应用于该div 我正在使用模板来应用该风格，

我想在图片中显示实际场景

这是我的JQUERY DIALOG

提交后，这是我的JQUERY DIALOG

加载程序正在运行，但它应该显示在对话框下面的对话框中 这是我的情景。 提前致谢。

Answer 1

使用css-position和 z-index作为加载程序。

您可以通过以下方式实现此目标：

#loading{width:100%;height:100%;
    background-image:url('loader.gif');
    background-position:centre;
    background-repeat:no-repeat;
    position:fixed;
    z-index:999}

Answer 2

将此样式添加到CSS中。其中.loader是加载程序元素的类名。

.loader {
    z-index: 9999 !important;
}

Answer 3

可能会对你有帮助，你可以用你的装载机类/ id添加它，无论

 {
  z-index:99999 !important;
 }

Answer 4

var zi = $("#parent_dialog_name").zIndex();
var lzi;
if (zi > 0) { lzi = zi + 1; }
else { lzi = 0; }
$("#loading").show();
$("#loading-overlay").css("position", "fixed");
$("#loading-overlay").css("display", "block");
$("#loading-overlay").zIndex(lzi);
$("#loading").zIndex(lzi + 1);

我这样做是为了解决我的问题