html - HTML 输入元素可以有多种类型吗？

Question

这是一个如此简单的问题，但我无法在这里或其他任何地方找到答案。

有没有办法为 HTML Input 元素提供多种类型？我想制作一个包含各种输入、一些文本和一些选择的表单。但我希望用户能够选择在提交表单时传递哪些字段。有没有办法完全在 HTML 中做到这一点(感觉这应该是一个简单的任务)，还是我必须求助于脚本？

Answer 1

一个输入不能有多种类型，但您也不必求助于脚本。您可以使用 CSS:

body{font-family:sans-serif}
#inp,#sel{display:block}
#cb{margin-bottom:20px}

#sel{
    display:none
}

#cb:checked ~ #inp{
    display:none
}

#cb:checked ~ #sel{
    display:block
}

<label for="cb">View as dropdown</label>
<input id="cb" type="checkbox">

<label id="inp">Car Model
<input type="text" name="carmodel">
</label>

<label id="sel">Car Model
<select name="carmodel">
    <option value="mazda">Mazda</option>
    <option value="ford">Ford</option>
    <option value="audi">Audi</option>
</select>
</label>