Question

我希望彼此之间有四种不同的形式。但是，当我输入下面的代码时，我会得到四个嵌套表单。第一种形式嵌套了接下来的三种形式。以下表格将接下来的两个表格等等......

<form name="my form" method="get">
<div id="contactInfo">
<p><fieldset><legend><strong>Contact Info</legend></strong></p>
    <label>Name</label><input type="text" name="FullName" style="width: 300px;" value="First and last name" /> <br>
    <label>Street Address</label><input type="text" name="Address" style="width: 300px;"/> <br>
    <label>Zip Code</label><input type="text" name="ZipCode" /> <br>
    <label>Email</label><input type="text" name="EmailAddress"style="width: 300px;" value="address@example.com" /> <br>
    <label>Phone</label><input type="text" name="PhoneNumber" />

<p><fieldset><legend><strong>Best day(s) to schedule a visit</strong></legend></p>
    <input type="checkbox" name="date" id="date1" value="Mon" /> Monday
    <input type="checkbox" name="date" id="date2" value="Tues" /> Tuesday
    <input type="checkbox" name="date" id="date3" value="Wed" /> Wednesday
    <input type="checkbox" name="date" id="date4" value="Thur" /> Thursday
    <input type="checkbox" name="date" id="date5" value="Fri" /> Friday
    <input type="checkbox" name="date" id="date6" value="Sat" /> Saturday
    <input type="checkbox" name="date" id="date7" value="Sun" /> Sunday

<p><fieldset><legend><strong>Project Area</strong></legend></p>
    <input type="radio" name="choice" id="choice1" value="frontOfHouse" /> Front of House <br>
    <input type="radio" name="choice" id="choice2" value="Border" /> Border of Property <br>
    <input type="radio" name="choice" id="choice3" value="multipleAreas" /> Multiple Areas (please specify in Notes box below) <br>
    <input type="radio" name="choice" id="choice4" value="Other" /> Other (please specify in Notes box below) <br>

<p><fieldset><legend><strong>Additional Information</strong></legend></p>
Notes <br>
    <textarea name="comments" align="left" rows="5" cols="50"></textarea>

<p></fieldset></p>

<input type="submit" value="Submit Request"/>

Answer 1

您有一个</fieldset>代码，但有四个<fieldset>代码。确保关闭每一个，你将避免嵌套问题！

编辑：

CodePen中显示的嵌套问题：http://codepen.io/cam5/pen/vXdGQz
那支笔，分叉，带有结束标签：http://codepen.io/cam5/pen/QKQNzw

Answer 2

得到小提琴。 https://jsfiddle.net/7p0g2hq9/

注意标签。

<form name="my form" method="get">
<div id="contactInfo">
<fieldset><p><legend>
<strong>Contact Info</strong></legend>
</p>

<label>Name</label><input type="text" name="FullName" style="width: 300px;" value="First and last name" /> <br>
    <label>Street Address</label><input type="text" name="Address" style="width: 300px;"/> <br>
    <label>Zip Code</label><input type="text" name="ZipCode" /> <br>
    <label>Email</label><input type="text" name="EmailAddress"style="width: 300px;" value="address@example.com" /> <br>
    <label>Phone</label><input type="text" name="PhoneNumber" />

</fieldset>

<fieldset><p><legend><strong>Best day(s) to schedule a visit</strong></legend></p>
    <input type="checkbox" name="date" id="date1" value="Mon" /> Monday
    <input type="checkbox" name="date" id="date2" value="Tues" /> Tuesday
    <input type="checkbox" name="date" id="date3" value="Wed" /> Wednesday
    <input type="checkbox" name="date" id="date4" value="Thur" /> Thursday
    <input type="checkbox" name="date" id="date5" value="Fri" /> Friday
    <input type="checkbox" name="date" id="date6" value="Sat" /> Saturday
    <input type="checkbox" name="date" id="date7" value="Sun" /> Sunday
    </fieldset>
<fieldset><p><legend><strong>Project Area</strong></legend></p>
    <input type="radio" name="choice" id="choice1" value="frontOfHouse" /> Front of House <br>
    <input type="radio" name="choice" id="choice2" value="Border" /> Border of Property <br>
    <input type="radio" name="choice" id="choice3" value="multipleAreas" /> Multiple Areas (please specify in Notes box below) <br>
    <input type="radio" name="choice" id="choice4" value="Other" /> Other (please specify in Notes box below) <br>
    </fieldset>
<fieldset><p><legend><strong>Additional Information</strong></legend></p>
Notes <br>
    <textarea name="comments" align="left" rows="5" cols="50"></textarea>

</fieldset>

<input type="submit" value="Submit Request"/>

如果我帮忙，请不要忘记标记为正确

HTML（表格卡在巢中）

2 个答案: