HTML表单的好坏？

Question

将1个文本框和2个Label元素“链接”到该1个文本框是否合法？

我们只说文本框是一个搜索字段。 2 Label元素代表您可以搜索的两种不同类型的东西。例如，单击标签1将聚焦文本框并更改基础表单隐藏属性。例如：

<form method="" action="">
   <label for="search" id="books">Search Books</label>
   <label for="search" id="games">Search Games</label>
   <input type="search" name="search" id="search" placeholder="What are you looking for?" />
</form>

<script type="javascript">
   // IF LABEL 1 (BOOKS) IS CLICKED, THEN SET HIDDEN FORM ELEMENT TO "BOOKS"
   // IF LABEL 2 (GAMES) IS CLICKED, THEN SET HIDDEN FORM ELEMENT TO "GAMES".
</script>

对SEO有什么影响？我可以想到一些，但不确定它们是否是有效的问题。

Answer 1

它没有任何问题，但设计很差。

我建议使用一组单选按钮或<select>让用户选择他们要搜索的内容。

Answer 2

如果你想检查它是否合法html / css询问W3C验证器： http://validator.w3.org/check