페이지를 다시로드하거나 새로 고치지 않고 내용을 표시합니다.

Question

JavaScript 및 단추를 사용하여 해당 부분을 다시 클릭하면 onclick 및 hide 부분을 표시합니다.

자바 스크립트 코드 :

<input type="button" onclick="return toggleMe('para2')" value="Technical Quiz" id="button"> 

및 내용은 다음과 같습니다 :

<script type="text/javascript"> 
function toggleMe(a){ 
var e=document.getElementById(a); 
if(!e)return true; 
if(e.style.display=="none"){ 
e.style.display="block" 
} 
else{ 
e.style.display="none" 
} 
return true; 
} 
</script> 

및 버튼에 대한 코드는

가장 큰 문제는 때 오페라 미니에서 볼

<div id="para3" style="display:none; color:#FFF;"> 
Rules are Coming UP... 
</div> 

및 uc 브라우저에서 해당 버튼을 onclicking하면 페이지가 다시로드되고 내용이 표시됩니다. 페이지를 새로 고침하고 싶지 않습니다. 난 그냥 페이지를 다시로드하지 않고 콘텐츠를 표시하고 싶습니다.

Answer 1

return true 기본 동작을 방해하지 않습니다. 기본 동작은 페이지를 다시로드합니다. 따라서 페이지를 다시로드하지 않으려면 return false해야합니다.

return false; 

추가 참고 사항. 페이지 재로드는 폼이 상기 버튼에 의해 부정확하게 제출 되었기 때문에 발생할 수 있습니다.

Answer 2

나는 리로드 페이지가 양식 제출로 인해 발생했음을 확신합니다. 입력이 요소에 의해 래핑되지 않았습니까?

입력 버튼의 기본 작동을 차단하는 toggleMe 함수에 e.preventDefault()을 추가 할 수 있습니다.