javascript - 当某个类调用时，我如何设置隐藏的正文溢出

Question

我想在使用“弹出”类时将正文溢出设置为隐藏。并通过 JavaScript 调用这个类。作为我的 CSS，它不起作用。
我可以像这样在我的类中嵌套“body”标签吗？

#CSS
.popup {
    display: table;
    height: 100% !important;
    table-layout: fixed;
    width: 100%;
    position: fixed;
    top: 0px;
    bottom: 0px;
    z-index: 400;
    body {
        overflow: hidden!important;
    }
}

我的示例是当您单击 Facebook 照片时，它会全屏显示并锁定滚动。感谢大家的帮助

我是这样调用它的。

<a href="#" onclick="getphoto(int)">Click to view larger</a>

JavaScript

function getphoto(inputString) {
        $('body').css('overflow', 'hidden');
        if(inputString.length == 0||false) {
             $('#suggestions3').fadeOut(); // Hide the suggestions box
        }else{
     //alert(inputString);
        $.post("p/photo.php", {queryString: ""+inputString+""}, function(data) { // Do an AJAX call
        $('#suggestions3').fadeIn(); // Show the suggestions box
        $('#suggestions3').html(data); // Fill the suggestions box
    });
}
}

inputString 是照片 ID。在 photo.php 中它返回 html 内容 <div class="popup">...my content...</div>

Answer 1

我可以像这样在我的类中嵌套“body”标签吗？不可以。

当 popup 类被调用时，以这种方式使用 jQuery .css():

$("body").css("overflow", "hidden");

更多信息:http://api.jquery.com/css/