3 回答
TA贡献2011条经验 获得超2个赞
我想我可能会看到你的问题。在这条线上
document.getElementById("LinkButton1").src = '../Images/invoice.PNG';
您似乎正在尝试更新按钮的 src 而不是图像。
尝试更新您的代码以使用 img 标签的 id,如下所示
document.getElementById("image1").src = '../Images/invoice.PNG';
EDIT1 好的,我现在添加,所以当您将鼠标悬停在按钮上时,图像可用,而当您将鼠标移出时,图像就会消失。我使用 css 可见性属性来执行此操作。我们使用 style 属性将图像默认内联设置为隐藏。当您将鼠标悬停在按钮上时,我们将可见属性设置为可见,而当您将鼠标移出按钮时,我们将其设置回隐藏。
这是执行此操作的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<button id="button1">Button</button>
<img id="image1" src="https://assets.pokemon.com/assets/cms2/img/pokedex/full/025.png" style="visibility: hidden;"></img>
</body>
<script>
function mouseOver(){
document.getElementById('button1').style.color = "green";
document.getElementById('button1').style.display = "inline";
document.getElementById('image1').style.visibility = "visible";
}
function mouseOut(){
document.getElementById('button1').style.color = "red";
document.getElementById('image1').style.visibility = "hidden";
}
document.getElementById('button1').onmouseover = mouseOver;
document.getElementById('button1').onmouseout = mouseOut;
</script>
</html>
我还使用新代码更新了 gitub 示例,并将其放入文件标题 index2.html 中。
TA贡献1818条经验 获得超8个赞
在您的建议和一些修改之间,我能够使代码按预期工作。
这是最终的代码。当我将鼠标悬停在链接按钮上时,图像显示在按钮下方,并在鼠标移出时消失。
<asp:LinkButton ID="LinkButton1" Font-Underline="true" runat="server"
OnMouseOver="mouseOver();" OnMouseOut="mouseOut();">Facility ID</asp:LinkButton>
function mouseOver() {
document.getElementById("image1").style.display = "inline";
document.getElementById("image1").style.backgroundimage = "input type=image";
}
function mouseOut()
{
document.getElementById("image1").style.display="none";
}
TA贡献1890条经验 获得超9个赞
LinkButton 只是 html 中的一个锚点,没有属性src
。它不是一个图像。使用背景图像。
document.getElementById("LinkButton1").style.backgroundImage = "url('image.png')";
或者将其更改为 ImageButton 控件,它变为<input type="image"
- 3 回答
- 0 关注
- 139 浏览
添加回答
举报