选择多个选择选项但以适当的下拉方式

Question

我有一个简单的城市下拉，我想使用多个选择选项。 为此，我使用了select标签的多个属性，但是通过使用它，下拉列表被转换为具有多个选择选项的盒形区域。 我想要的是下拉外观应该保持原样，即点击选择下拉列表时应该出现在其中我可以使用CTRL的多个城市，其值将在php脚本中使用。 我已经看过多个jquery脚本但是我想知道是否有一些简单的方法来做这个而不是使用任何jquery或其他东西。 有没有更简单的方法呢？

Answer 1

请尝试以下代码：

<select id="city" multiple="multiple" name="city[]">
    <option>hawaii</option>
    <option>michigan</option>
    <option>southfield</option>
</select>

你在php中获得了多个城市价值

echo $_POST['city'];

Answer 2

HTML下拉是这样做的，不允许多项选择，但你可以使用一些jquery插件，比如 this 来做这件事，它比自己创建这样的插件简单得多。 / p>

Answer 3

原则上，size=1中的select属性会告诉浏览器只显示一个选项，您可以使用脚本来更改size属性的值以创建下拉列表影响。在实践中，它几乎不起作用。

更实际的方法是首先设置select元素的高度，然后在鼠标悬停和焦点时更改高度。不幸的是，浏览器行为在调整元素大小时并不一致，但结果可能是可以容忍的。请注意，默认情况下，选项中的字体大小会减小，因此调整大小有点棘手。在这个例子中，我只需将字体大小设置为100％，以便可以以简单的方式使用em单位：

option { height: 1.3em; font-size: 100%; }
select { height: 1.3em; font-size: 100%;  }
select:hover, select:focus { height: 13em; }

某些浏览器的结果有点太小，而某些浏览器的结果有点太大，IE没有显示任何箭头表示它确实是一个下拉列表。