HTMLフォームのセクションを隠す/表示する方法

Question

私はHTMLフォームを提出すると、PHPを使用してすべての質問と回答を含むメールを送信します。

フォームが長すぎるため、フォームを削除する必要があります。ボタンを1つだけ送信し、フォームを1回だけロードする必要があります。これは明らかにJavaScriptの表示/非表示を使用する必要があることを意味します。

私は多くの種類を使用しようとしましたが、フォームで正しく動作させることができません。それは非常に大きく、表示/非表示を動作させるために非常に複雑であるように思わ:(

私はテーブルの前に表示/非表示のdivを使用しなくてきました。

誰でも助けることができる何かを持っている？

私がしたいことはあり

、フォームの別のセクションに移動します

• 次のボタン。
• 前のセクションに戻り、または別のセクションに行くことができ、次のセクションになくなり再度。
• 前のセクションまたはサブミットを含む最後のセクション。

ありがとうございます。

Answer 1

これはかなり一般的な要求です。ここで

が id Sを管理するのは簡単で div Sを使用してページ内のフォームを破ると、最初の一つだけ見える

一つの方法です。

<form action=".." ..> 
<!-- the first page has style set to be visible --> 
<div id="formpage_1" style="visibility: visible; display: block; .."> 
    <label for="..">..</label> 
    <input type=".." ..> 
    .. 
    <!-- NEXT button --> 
    <input type="button" value="next" onclick="pagechange(1,2);"> 
</div> 
<!-- the 2nd and following pages have style set to be invisible --> 
<div id="formpage_2" style="visibility: hidden; display: none; .."> 
    <label for="..">..</label> 
    <input type=".." ..> 
    .. 
    <!-- PREVIOUS and NEXT buttons --> 
    <input type="button" value="back" onclick="pagechange(2,1);"> 
    <input type="button" value="next" onclick="pagechange(2,3);"> 
</div> 
... 
<div id="formpage_10" style="visibility: hidden; display: none; .."> 
    <label for="..">..</label> 
    <input type=".." ..> 
    .. 
    <!-- PREVIOUS and SUBMIT buttons --> 
    <input type="button" value="back" onclick="pagechange(10,9);"> 
    <input type="submit" value="Submit"> 
</div> 

• ページ

を切り替えるには、単純なJS関数を使用します。あなたはテーブルレイアウトを使用する場合は

function pagechange(frompage, topage) { 
    var page=document.getElementById('formpage_'+frompage); 
    if (!page) return false; 
    page.style.visibility='hidden'; 
    page.style.display='none'; 

    page=document.getElementById('formpage_'+topage); 
    if (!page) return false; 
    page.style.display='block'; 
    page.style.visibility='visible'; 

    return true; 
} 

編集

、複数のテーブルに（各ページに1つ）のために壊して、代わりにdivの

のテーブルにid秒を与えます