如何允许用户在下拉列表中添加选项？

Question

我有一个包含许多选项的下拉列表。我想创建一个“添加选项”按钮，以便用户可以在文本输入框中编写新选项，然后它将自动添加到列表中。

我该怎么做？

Answer 1

您需要使用JavaScript并尝试使用此类内容（Example）

<强> HTML：

<select id="sel" name="sel">
    <option value='none'>None</option>
</select>
<input type='text' name='option' id='option' />
<button id='btnAdd'>Add Option</button>

<强> JS：

var btn = document.getElementById('btnAdd');
btn.onclick = function(){
    var tb = document.getElementById('option'), val = tb.value;
    if(val.length){
        var sel = document.getElementById('sel');
        var opt = document.createElement('option');
        opt.value = val;
        opt.innerHTML = val;
        sel.appendChild(opt);
        tb.value = '';
    }
};