我正在编写一些简单的代码来在单击按钮时更改图像的可见性,但是我的 document.getElementById().value
显示为 undefined
。 (我尝试用 .display
替换 .value
- 结果相同)。
可能是什么问题?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script>
function hideImage(imageId){
document.getElementById(imageId).visibility="hidden";
}
function showImage(imageId){
document.getElementById(imageId).visibility="visible";
}
function switchVis(imageId){
var curVis = document.getElementById(imageId).value;
if(document.getElementById(imageId).value=="hidden"){
document.getElementById("output").innerHTML="hidden";
showImage(imageId);
}
else if(document.getElementById(imageId).value=="visible"){
hideImage(imageId);
document.getElementById("output").innerHTML="visible";
}
else{
alert("Visibility Issue!\nVisibility value is " + curVis);
}
}
</script>
</head>
<body>
<img src="images/k3.gif" id="k3"><p>
<button onclick=switchVis('k3')>Visibility</button>
<div id="output"></div>
</body>
最佳答案
您不能简单地使用 document.getElementById().value
获取 style
值。 getComputedStyle()
给出元素所有 CSS 属性的最终使用值。返回的样式是一个 CSSStyleDeclaration
对象,可用于获取样式的值。尝试以下代码。它应该有效。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script>
function hideImage(imageId){
document.getElementById(imageId).style.visibility="hidden";
}
function showImage(imageId){
document.getElementById(imageId).style.visibility="visible";
}
function switchVis(imageId){
var curVis = document.getElementById(imageId); //your element
style = window.getComputedStyle(curVis); //returns CSSStyleDeclaration object
curVis = style.getPropertyValue('visibility'); //now get your css value
if(curVis=="hidden"){
document.getElementById("output").innerHTML="visible";
showImage(imageId);
}
else if(curVis=="visible"){
hideImage(imageId);
document.getElementById("output").innerHTML="hidden";
}
else{
alert("Visibility Issue!\nVisibility value is " + curVis);
}
}
</script>
</head>
<body>
<img src="images/k3.gif" id="k3" value="check"><p>
<button onclick="switchVis('k3')">Visibility</button>
<div id="output"></div>
</body>
关于javascript - getElementById().value 返回未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18100068/