我正在开发WebApi项目。
在 index.cshtml 文件中,我尝试根据按钮单击显示和隐藏div。现在我正在使用可见性隐藏和可见.取而代之的是,我需要使用显示无并显示,因为 visibility="hidden" 方法只是隐藏div 它不会删除div 空间,如果我显示第二个div,它位于第一个div 下。
我的代码
<table>
<tr>
<td>
<input type="button" value="Hide" runat="server" onclick="Testing()"/>
<input type="button" value="Show" runat="server" onclick="Testing2()"/>
</td>
</tr>
<tr>
<td>
<div runat="server" id="InputuploadDivTest" style="visibility:visible">
@Html.Raw(@TempData["tranresult"])
</div>
</td>
</tr>
<tr>
<td>
<div runat="server" id="UilDivTest" style="visibility:hidden">
@Html.Raw(@TempData["Result"])
</div>
</td>
</tr>
</table>
脚本代码
<script type="text/javascript">
function Testing()
{
document.getElementById("InputuploadDivTest").style.visibility = "visible";
document.getElementById("UilDivTest").style.visibility = "hidden";
}
function Testing2() {
document.getElementById("UilDivTest").style.visibility = "visible";
document.getElementById("InputuploadDivTest").style.visibility = "hidden";
}
</script>
如何使用显示:无并为我的上述代码显示?
您可以使用"display:none"隐藏特定的div
<div runat="server" id="UilDivTest" style="display:none">
@Html.Raw(@TempData["Result"])
</div> >
您同样可以通过以下方式显示此div:
function Testing2() {
document.getElementById("UilDivTest").style.display = "block"
}
您还可以通过向其添加"display"属性来隐藏特定的div:
document.getElementById("UilDivTest").style.display = "none"