将html表单划分为不同的div

Question

我只是想把一个带有多个输入的表单放到不同的div中.

我有4个主要部分,我需要分成单独的div,但他们都必须发布到一个PHP文件.在我尝试设置页面布局时需要分离.

    <div id="1">
    <form method="post" action="process.php"> 
    URL <input type="text" name="url" size="50"/>
    </div>

    <div id="2">
    <input type="checkbox" name="ck1" value="option1" />
    <input type="checkbox" name="ck2" value="option2" />
    <input type="checkbox" name="ck3" value="option3" />
    </div>

    <div id="3">
    <input type="checkbox" name="ck4" value="option4" />
    <input type="checkbox" name="ck5" value="option5" />
    <input type="checkbox" name="ck6" value="option6" />
    </div>

    <div id="4">
    <input type="submit" value="Submit">
</form>
    </div>

这确实有效,但没有明显的原因验证.我尝试使用fieldset元素,但它有文件集周围的行边界似乎不适合我的情况.什么是形式化的正确方法,并使其仍然有效？

Answer 1

您需要做的是使用fieldset标记,但是,这是许多人的一个选项.

示例:fieldset

为了说明这个例子,请在此处查看我的代码/结果:http: //jsfiddle.net/grARw/

确保表单标记位于顶部和底部,而不是div元素之间.

这是代码:

<form method="post" action="process.php"> 
    <fieldset id="f1">
        <label>URL</label><input type="text" name="url" size="50"/>
    </fieldset>    
    <fieldset id="f2">
        <p><input type="checkbox" name="ck1" value="option1" /> Yes</p>
        <p><input type="checkbox" name="ck2" value="option2" /> No</p>
        <p><input type="checkbox" name="ck3" value="option3" /> Maybe</p>
    </fieldset>  
    <fieldset id="f3">
        <input type="checkbox" name="ck4" value="option4" /> Great
        <input type="checkbox" name="ck5" value="option5" /> Average
        <input type="checkbox" name="ck6" value="option6" /> Poor
    </fieldset >
    <fieldset id="f4">
        <input type="submit" value="Submit">
    </fieldset>
</form>