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

它没有任何问题,但设计很糟糕.

我建议使用一组Radio Buttons或a <select>让用户选择他们正在搜索的内容.