html下拉框怎么用js添加新值

html下拉框怎么用js添加新值

javascript添加一个下拉列表项的方法：创建一个新的option节点，然后添加到目标select对象中去，关键代码如下：

1、var objSelect = document.getElementById(select_id)。

2、var new_opt = new Option(objItemText, objItemValue)。

3、objSelect.options.add(new_opt)。

实例演示如下：

1、HTML结构，包括一个select项，含有三个options。另外，设置input和button,通过自由父子，实现给select增加自定义option。

此时的显示效果如下，其中option中有三项。

2、JS的函数设计如下：

现有的options如下：

3、在页面上输入新的数据，点击添加。

此时的select效果显示如下，自由添加功能实现。

value属性比较特殊，尽管value属性不是select元素的标准属性，但在JS中是可以通过select对象.value来获取选定值的

通过这种方法取得的value值实际上是所选择的option的value值。

像你这样直接在select标签的html代码中设置了一个value属性，JS仍然会把它当作是自定义属性。所以就出现了例子中这个比较“奇怪”的现象。

---