如何创建像 pinterest 这样的搜索栏？答案

【问题标题】：How do you create a search bar like pinterest?如何创建像 pinterest 这样的搜索栏？
【发布时间】：2015-05-14 05:03:25
【问题描述】：

https://kimvij.files.wordpress.com/2014/09/new-interest-icons-plus-featured.png

如上图所示，您可以选择可以搜索的类别。我知道可以使用具有类别的选择下拉菜单创建搜索表单，但问题是“选择”下拉菜单很难用 css 设置样式，我想制作自己的自定义按钮，其下拉菜单与 pinterest 类似。

我能想到的唯一其他方法是使用“ul li”来获取值并设置下拉菜单的样式。我的问题是，如果我在表单中使用“ul li”，我还能获得它的输入值吗？例如。

<form action="" method="post">
	<input type="text" name="search">
	<ul id="dropdown">
		<li id="category-1"></li>
		<li id="category-2"></li>
		<li id="category-3"></li>
	</ul>
</form>

如果没有，最好的方法是什么？

【问题讨论】：

标签： php css forms search categories

【解决方案1】：

我认为您无法从表单中获取 li 值。你可以通过两种方式做到这一点。您可以使用自定义样式设计自己的菜单。

如果您打算通过ajax 执行此操作，请使用jQuery 将一个类添加到选定的li 并在提交之前检索相同的内容。
如果您使用php 提交，那么我建议您使用hidden 字段并在每次选择后使用jQuery 更改hidden 字段内的值

【讨论】：

听起来像是一个计划。我去做。谢谢。