的Javascript - 多種表單顯示問題

所以我使用表單，當你點擊它，它帶來了另一種形式，然後又等等的Javascript - 多種表單顯示問題

對於這個例子，這是我到目前爲止有：

<head> 
<script langauge="javascript"> 
function showGeneral(){ 
    document.getElementById('general').style.display="block"; 
    document.getElementById('colors').style.display="none"; 
    document.getElementById('domain').style.display="none"; 
    document.getElementById('details').style.display="none"; 
} 

function showColors(){ 
    document.getElementById('general').style.display="none"; 
    document.getElementById('colors').style.display="block"; 
    document.getElementById('domain').style.display="none"; 
    document.getElementById('details').style.display="none"; 
} 

function showDomain(){ 
    document.getElementById('general').style.display="none"; 
    document.getElementById('colors').style.display="none"; 
    document.getElementById('domain').style.display="block"; 
    document.getElementById('details').style.display="none"; 
} 

function showDetails(){ 
    document.getElementById('general').style.display="none"; 
    document.getElementById('colors').style.display="none"; 
    document.getElementById('domain').style.display="none"; 
    document.getElementById('details').style.display="block"; 
} 

</script> 
</head> 

<body> 
<div id="general" name="general"> 
<h1> General </h1> 
<form id="general" name="general"> 
    Name <input type="text" id="frm1txt1" name="frm1txt1"/> <br> 
    Email <input type="text" id="frm1txt2" name="frm1txt2"/> <br> 
    <input type="button" id="frm1btn1" name="frm1btn1" value="Continue" onclick="showColors();"/> <br> 
</form> 
</div> 



<div id="colors" name="colors" style="display:none"> 
<h1> Colors </h1> 
<form id="frm2" name="frm2"> 
    Green? <input type="text" id="frm2txt1" name="frm2txt1"/> <br> 
    Red? <input type="text" id="frm2txt2" name="frm2txt2"/> <br> 
    <input type="button" id="frm2btn1" name="frm2btn1" value="Continue" onclick="showDomain();"/> <br> 
</form> 
</div> 


<div id="domain" name="domain"> 
<h1> Domain Name? </h1> 
<form id="frm1" name="frm1"> 
    Yes <input type="text" id="frm1txt1" name="frm1txt1"/> <br> 
    No <input type="text" id="frm1txt2" name="frm1txt2"/> <br> 
    <input type="button" id="frm1btn1" name="frm1btn1" value="Continue" onclick="showDetails();"/> <br> 
</form> 
</div> 

<div id="details" name="details"> 
<h1> Describe Your Order </h1> 
<form id="frm1" name="frm1"> 
    Img <input type="text" id="frm1txt1" name="frm1txt1"/> <br> 
    kk <input type="text" id="frm1txt2" name="frm1txt2"/> <br> 
    <input type="button" id="frm1btn1" name="frm1btn1" value="Finish" onclick="showGeneral();"/> <br> 
</form> 
</div> 

</body>

功能正常工作 - 但問題是它顯示頁面刷新/加載的所有表單。我怎樣才能做到這一點，所以當你加載頁面時只顯示第一個頁面？

乾杯！

來源

2011-12-11 Adam McArthur

的Javascript - 多種表單顯示問題

回答

相關問題