Question

我有一个通过ajax创建的div，我想在div弹出后禁用整个身体，直到div，除非div被关闭。
这是否可能在jquery中。请让我知道你的建议

谢谢你，Praveen Jayapal

Answer 1

你想要移除，还是隐藏身体？从技术上讲，这是不可能的，因为你需要将div附加到身体上才能看到它。你可以做的是创建一个覆盖整个身体的“面具”图层，然后使用你的div的z-index将它显示在身体的顶部。

类似的东西：

http://www.queness.com/post/77/simple-jquery-modal-window-tutorial

可能有帮助！

要完全隐藏页面，您需要做的就是更改第21行：

$('#mask').fadeTo("slow",0.8);

在javascript中：

$('#mask').fadeTo("slow",1);

并且CSS第7行的蒙版颜色也可以改为你想要的颜色：

background-color: #000;

Answer 2

应该这样做..

HTML：

<body>
    <div id="overlay">
        this is above the body!
    </div>
<!--...rest...-->
</body>

CSS：

#overlay {
    background-color: #ccc; /*or semitransparent image*/
    display: none;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
}
#ajax-div {
    z-index: 200; /*important, that it is above the overlay*/
}

使用Javascript：

<script type="text/javascript">
$(document).ready(function() {
    //your ajax-call
    $.ajax({
        //on success
        success: function() {
            //your logic your showing the ajax-div
            $('#overlay').show(); //or fadeIn()
        }
    })

    //use live to catch the close-click of the later added ajax-div
    $('#ajax-div a#close').live('click', function() {
        //close the ajax-div
        $(this).parent().hide();
        //close the overlay
        $('#overlay').hide(); //or, again, fadeOut()
    });
});
</script>

Answer 3

你想要的是一种称为模态对话框的东西。

有很多JQuery脚本可以很容易地实现这一点。以下是一些链接：

希望有所帮助。

Answer 4

好的......如果使用jquery，最好的想法是使用jquey.ui。

http://jqueryui.com/demos/dialog/#modal

您可以选择主题并仅下载您喜欢的组件..

然后只包含js和css一个地方img文件夹和调用对话框。它很安静......

如何禁用除div之外的整个身体

4 个答案: