Question

有没有办法在下拉菜单中使用简单的表单插入值？我有这个下拉菜单

<form>
  <select name="users" onchange="showUser(this.value)">
    <option value="">Select a category:</option>
    <option value="movie">Movie</option>
    <option value="musik">Musik</option>
    <option value="books">Books</option>
    <option value="images">Images</option>
  </select>
</form>

我应该使用数组吗？我一直在网上搜索，但找不到任何有用的东西。

Answer 1

这是一个将项目添加到下拉列表的JavaScript解决方案。

要使用的HTML ..

 <form>
    <select id="categories" name="users" onchange="showUser(this.value)">
    <option value="">Select a category:</option>
    <option value="movie">Movie</option>
    <option value="musik">Musik</option>
    <option value="books">Books</option>
    <option value="images">Images</option>
    </select>
    </form>

JavaScript代码......

var categories = document.getElementById("categories");

var newOption = document.createElement('option');
newOption.innerText = "New value";
newOption.setAttribute('value', 'newvalue');

categories.appendChild(newOption);

jQuery代码......（更短）

$("#categories").append("<option value='newvalue'>New Value</option>");

以下是JavaScript JSFiddle和jQuery JSFiddle！

Answer 2

您可以使用append()事件查看jQuery option()和click ...

我刚刚为您创建了一个有效的解决方案。不知道这是不是你想要的，但这是它的工作原理：
您只需将值和可视选项名称写入表单文本字段：value, text即可获得此信息：
<option value="value">text</option>

<select id="mySelect"></select>
<p>&nbsp;</p>
<input type="text" id="string"><br>
<button id="append">Append</button>


$('#append').click(function(){
    var str = $('#string').val();
    var substr = str.split(', ');
    $('#mySelect').append( new Option(substr[0],substr[1]));
});

以下是工作版本：http://jsfiddle.net/SCf8m/1/

使用表单向下拉菜单添加值

2 个答案: