Question

我正在尝试制作具有特定尺寸的内容区域，但如果来自api的返回结果为为空，我不希望显示任何内容。

这是html的代码：

<div class="myclass">
        <iframe frameborder="0" src="http://localhost:1000/example"></iframe>
</div>

我正在调用有时可能返回null结果的API。 Javascript不在桌面上。我试过用这样的css克制：

.myclass {
max-width: 1060px; 
max-height: 392px;

  & > iframe {
      min-height: 0;
      min-width: 0;
      max-width: 1060px;
      max-height: 392px;
    }

   & > iframe:empty {
    display: none;
 }
}

css的行为是：iframe一直被隐藏，虽然我内心有内容。如果iframe是这样的话：

<div class="myclass">
        <iframe frameborder="0" src="http://localhost:1000/example">
        <!--notice white-space here-->
        </iframe>
</div>

css不会将iframe视为空。

Answer 1

我实际上是在没有javascript的情况下实现的。

但是你需要创建一个生成css的代理。

如果下面不可能，那么所有赌注都会出现。祝你好运！

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        @import url('iframecheck.asp?url=http://www.example.com');
        iframe {
            width:1000px;
            height:400px;
        }
    </style>
</head>
<body>
<iframe src="http://www.example.com"></iframe>
</body>
</html>

iframecheck包含检查url是否为空响应的代码，如果是，则返回css，如下所示：

iframe {
    display:none;
}

将自动覆盖其他iframe样式。

如果你这样做，请忘记强制使用text / css内容类型标题。

<%response.ContentType="text/css"%>

如果没有javascript没有返回任何内容，如何隐藏iframe

1 个答案: