<select> 不允许出现在 <form> 标签中？

Question

我正在清理网站代码。我正在做的一件事是运行每个页面的代码通过 W3C 标记验证服务：https://validator.w3.org/

对于我当前正在处理的页面，验证器给了我很多错误。我几乎已经修复了所有问题，但有一个错误我无法弄清楚： Line 92, Column 108: document type does not allow element "select" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "pre", "address", "fieldset", "ins", "del" start-tag

给我这个错误的代码部分在这里（第 92 行是以 select size="1" 开头的，第 108 列似乎就在 Pageselector 之后的句号之前）：

<div style="text-align:center;">
    <form id="Pageselector" action="">
        <select size="1" name="FC" onchange="location.href=Pageselector.FC.options[selectedIndex].value">
            <option selected="selected">Go to Page...</option>
            <option value="AC_1.html">Page 1: Introduction</option>
            <option value="AC_2.html">Page 2: Essential Optimization</option>
            <option value="AC_3.html">Page 3: Troubleshooting Tips</option>
            <option value="AC_4.html">Page 4: Patches &amp; Mods</option>
            <option value="AC_5.html">Page 5: In-Game Settings</option>
            <option value="AC_6.html">Page 6: In-Game Settings (Pt.2)</option>
            <option value="AC_7.html">Page 7: In-Game Settings (Pt.3)</option>
            <option value="AC_8.html">Page 8: Advanced Tweaking</option>
            <option value="AC_9.html">Page 9: Adv. Tweaking (Pt.2)</option>
            <option value="AC_10.html">Page 10: Neat Stuff &amp; Concl.</option>
        </select>
    </form>
</div>

有问题的代码是一个下拉列表，可让您 select 您想要查看系列中的哪个网页。选择一个选项后，浏览器会打开 selected 页面。我不明白问题出在哪里，因为根据 w3schools，允许 select 元素位于 form 元素内：https://www.w3schools.com/tags/tag_form.asp

如果您需要查看页面上的所有代码或需要其他任何东西，您可以这样说，我会编辑这个问题。我使用的 DocType 是 XHTML 1.0 Strict。上面的代码确实做了它应该做的。我只是想清理和重构它。

Answer 1

我很确定问题不在于表格。我不认为你可以突然说 Pageselector.FC； select html 元素不正确。尝试使用 this 代替。或者更好的是，将整个事情移动到 JS 函数。

<select size="1" name="FC" onchange="location.href = this.options[selectedIndex].value">

this 指的是 this 属于的元素 - select 元素。

Answer 2

我做了更多挖掘并找到了答案。首先，我测试了将页面的 DocType 从 Strict 更改为 Transitional 然后重新验证。这使错误消失了。然后我做了一些搜索，发现了这个问题：Strict doctype - form and input element

似乎 Strict DocTypes 不允许您将 Input（或 Select）元素作为 Form 元素的直接后代。直系后代必须是错误消息中列出的元素之一。有了这些知识，我已经设法摆脱了错误消息。

为了修复它，我将代码更改为以下内容（我只是交换了 Form 和 Div 元素，并包含了 wazz 的建议）：

<form id="Pageselector" action="">
    <div style="text-align:center;">
        <select size="1" name="FC" onchange="location.href = this.options[selectedIndex].value">
            <option selected="selected">Go to Page...</option>
            <option value="AC_1.html">Page 1: Introduction</option>
            <option value="AC_2.html">Page 2: Essential Optimization</option>
            <option value="AC_3.html">Page 3: Troubleshooting Tips</option>
            <option value="AC_4.html">Page 4: Patches &amp; Mods</option>
            <option value="AC_5.html">Page 5: In-Game Settings</option>
            <option value="AC_6.html">Page 6: In-Game Settings (Pt.2)</option>
            <option value="AC_7.html">Page 7: In-Game Settings (Pt.3)</option>
            <option value="AC_8.html">Page 8: Advanced Tweaking</option>
            <option value="AC_9.html">Page 9: Adv. Tweaking (Pt.2)</option>
            <option value="AC_10.html">Page 10: Neat Stuff &amp; Concl.</option>
        </select>
    </div>
</form>

编辑：根据下面的评论，您也可以使用此代码（添加了 fieldset 标签）：

<div style="text-align:center;">
    <form id="Pageselector" action="">
        <fieldset style="margin-left: 0px; margin-right: 0px; padding-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; border: 0px;">
            <select size="1" name="FC" onchange="location.href = this.options[selectedIndex].value">
                <option selected="selected">Go to Page...</option>
                <option value="AC_1.html">Page 1: Introduction</option>
                <option value="AC_2.html">Page 2: Essential Optimization</option>
                <option value="AC_3.html">Page 3: Troubleshooting Tips</option>
                <option value="AC_4.html">Page 4: Patches &amp; Mods</option>
                <option value="AC_5.html">Page 5: In-Game Settings</option>
                <option value="AC_6.html">Page 6: In-Game Settings (Pt.2)</option>
                <option value="AC_7.html">Page 7: In-Game Settings (Pt.3)</option>
                <option value="AC_8.html">Page 8: Advanced Tweaking</option>
                <option value="AC_9.html">Page 9: Adv. Tweaking (Pt.2)</option>
                <option value="AC_10.html">Page 10: Neat Stuff &amp; Concl.</option>
            </select>
        </fieldset>
    </form>
</div>

<select> 不允许出现在 <form> 标签中？

<select> not allowed in <form> tag?

html

forms

validation

xhtml-1.0-strict

drop-down-menu