Question

我试过这个，没有成功：

JS：

function Hide() {
    alert('Hide');
    document.getElementById('I').style.visibility = 'none';

}

function show() {
    alert('Show');
    document.getElementById('I').style.visibility = 'visible';

}

代码背后：

<asp:LinkButton ID="LinkButton1" onmouseover="show()" onmouseout="Hide()" runat="server">Mouse Here</asp:LinkButton>

<asp:Image Visible="false" ImageUrl="~/Images/V.png" ID="I" runat="server" />

我添加了警报只是为了检查这是否激活了该功能，而且它是。

有什么建议吗？

谢谢！

Answer 1

将visibility更改为hidden而不是none

function Hide() {
    alert('Hide');
    document.getElementById('I').style.visibility = 'hidden';

}

Answer 2

虽然Munawir's post更正并回答了您的问题，但IMO最好使用display代替show/hide元素，以便更有效地实现此目的。

display:none表示该元素根本不会出现在页面上，不会为其分配空间。

visibility:hidden该元素不可见，但在页面上为其分配了空间。

示例：

function Hide() {
    alert('Hide');
    document.getElementById('I').style.display = 'none';

}

function show() {
    alert('Show');
    document.getElementById('I').style.display = 'block';

}

希望这有帮助。

Answer 3

您的代码

document.getElementById('I').style.visibility = 'none';

错误应该是

document.getElementById('I').style.visibility = 'hidden';

另外请记住，将元素可见性设置为隐藏将隐藏元素，但仍占据屏幕上的空间，

如果您不希望元素在隐藏时占用空间，则必须使用display :none;

document.getElementById('I').style.display = 'none';

然后你可以使用

使其可见

document.getElementById('I').style.display = 'block';

如何在JavaScript中更改图像可见性？

3 个答案: