javascript - 允许用户选择 1 个或多个美国州的最佳方式

Question

我现在正在处理一个关于位置的问题，即美国各州。这个问题可以通过一个或多个状态选择来回答。我的问题是，这样做的最佳方法是什么？

我唯一能想到的就是使用 JS 来确定是否在下拉菜单中选择了“逐个州”，如果是这样，则某种小框架会出现所有 50 个状态作为复选框。我试图避免让所有 50 个州的复选框弄乱我的表格。我想另一种选择是只有在选择“逐个州”选项时才会出现一个隐藏的 div。

但我敢肯定以前有其他人这样做过，如果他们找到了有效的解决方案，我不想重新发明轮子。

任何帮助将非常感激！

Answer 1

尝试：

<select name='states' multiple size=10>
<option....
</select>

Answer 2

复制元素的单个<select>和 s 按钮“添加另一个状态”？

HTML：

<div>
<select name="states[]" id="states">
    <option>AL</option>
    <option>CA</option>
    <option>IL</option>
    <option>WA</option>
</select>
</div>
<span id="add">+ Add another state</span>

JS

var states = document.getElementById('states'),
    add = document.getElementById('add');

add.addEventListener('click', function(){
    states.parentNode.appendChild( states.cloneNode(true) );
});

http://jsfiddle.net/dx4CP/