Question

HTML有13个表单元素，输入元素有23种不同的类型。 我的问题是，将表单元素作为输入类型或其自身元素的原因是什么？

起初我认为可能是因为所有输入类型都只是input type=text上的变体，但是当你将checkbox和radio投入混合时，这是没有意义的。也许他们会更好地成为自己的形式元素？

<input type="checkbox" name="check" value="yes">
// Would become
<checkbox name="check" value="yes">

另一个对我没有意义的表单元素是textarea，原因有两个。

根据How to change the Content of a with Javascript，您可以使用element.value来设置和检索textarea的内容。但是textarea没有value属性，至少它没有显示在DOM中。
重置表单时textareas的行为方式与其他表单元素不一致。所有input元素都将重置为其value属性的值。但textarea会被重置为其值＆＃39; （引号因为它在DOM中没有值属性）被设置为加载页面时。

示例1（与输入一致）：如果您点击重置按钮，input和＆＃39; textarea＆＃39;将被重置为他们的初始＆＃39; values（示例使用jQuery）。 JSFiddle

<form>  
    <input type="text" name="text" value="initial" />
   <textarea>initial</textarea>
   <button type="reset">Reset</button>
</form>

<script>
    $('input, textarea').val('set by javascript');
</script>

示例2（与输入不一致）：您不能将.attr('value')与textarea元素一起使用，这意味着以下示例不起作用。您必须使用$('textarea').text()或$('textarea').html()才能设置默认值。

<form>  
    <input type="text" name="text" value="initial" />
   <textarea>initial</textarea>
   <button type="reset">Reset</button>
</form>

<script>
    $('input, textarea').attr('value', 'set by javascript');
</script>

还有其他一些事情对我没有意义，但我只会在我的问题中突出这两点。我希望有人可以向我解释为什么HTML和Javascript以不同的方式处理表单元素（特别是在获取，设置和重置其值时），以及为什么某些表单元素有自己的元素以及为什么其他元素只是types元素的input。

HTML表单元素VS输入元素类型

0 个答案: