2012-07-12 12 views
0

숨겨진 속성을 사용하여 HTML 페이지에서 하나의 이미지를 숨길 수 있습니다. 하지만 난 document.getElementById("check").style.visibility="visible";에서 자바 스크립트를 통해 볼 수 있도록 할 수없는 오전 내 코드는이미지가 동적으로 표시되지 않습니다.

<html> 
<head> 
<style type="text/css"> 
</style><script type="text/javascript"> 
function myFunction() 
{ 
document.getElementById("check").style.visibility="visible"; 
} 
</script> 
</head> 
<body> 
<table> 
<img class="hide" src="check.jpg" id="check" hidden="true" height="300" width="400"> 
<tr> 
<td> 
<img src="1.jpeg" onclick="myFunction()"> 
</td> 

답변

1

hidden="true"을 숨기려면이 속성을 해제해야 요소를 다시 표시 할 수 있습니다.

<html> 
<head> 
<style type="text/css"> 
</style><script type="text/javascript"> 
function myFunction() 
{ 
    document.getElementById("check").hidden = ''; 
} 
</script> 
</head> 
<body> 
<table> 
<img class="hide" src="check.jpg" id="check" hidden="true" height="300" width="400"> 
<tr> 
<td> 
<img src="1.jpeg" onclick="myFunction()"> 
</td> 
2

당신은 실제로

function myFunction() { 
    document.getElementById("check").style.visibility = "visible"; 
} 

당신은 또한 숨겨진 제거 할 필요가 함수에 그 변수에 뭔가를 할당하는 것을 잊지입니다 속성을 삭제하고 "숨기기"클래스를 삭제하십시오.

function hasClass(ele,cls) { 
    return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)')); 
} 
function removeClass(ele,cls) { 
    if (hasClass(ele,cls)) { 
    var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)'); 
    ele.className = ele.className.replace(reg,' '); 
} 
function myFunction() { 
    var ele = document.getElementById("check"); 
    ele.style.visibility = "visible"; 
    ele.hidden = ""; 
    removeClass(ele, "hide"); 

} 
0

visibility CSS를 변경하고 적용해야합니다.

function myFunction() 
{ 
    document.getElementById("check").style.visibility = "visible"; 
} 

스크립트를 사용하여로드시 가시성을 설정하는 것이 좋습니다.

document.getElementById("check").style.visibility = "hidden"; 

때로는 CSS에서 정의 할 때 작동하지 않습니다.

0
<html> 
<head>  
    <script type="text/javascript"> 
     function myFunction() 
     { 
      document.getElementById("check").style.visibility="visible"; 
     } 
    </script> 
</head> 
<body> 
    <table> 
     <img src="check.jpg" id="check" hidden="true" height="300" width="400" style="visibility:hidden;"/>  
     <tr> 
      <td> 
       <img src="1.jpeg" onclick="myFunction()"> 
      </td> 
     </tr> 
    </table> 
</body> 

관련 문제