<html>
<head>
<meta name="keywords" content="javascript select options text value add modify delete set">
<meta name="description" content="javascript select options text value add modify delete set">
<script language="javascript">
function watch_ini(){
for(var i=0i<arguments.lengthi++){
var oOption=new Option(arguments[i],arguments[i])
document.getElementById("MySelect")[i]=oOption
}
}
function watch_add(f){
var oOption=new Option(f.word.value,f.word.value)
f.keywords[f.keywords.length]=oOption
}
function watch_sel(f){
f.word.value = f.keywords[f.keywords.selectedIndex].text
}
function watch_mod(f){
f.keywords[f.keywords.selectedIndex].text = f.word.value
}
function watch_del(f){
f.keywords.remove(f.keywords.selectedIndex)
}
function watch_set(f){
var set = ""
for(var i=0i<f.keywords.lengthi++){
set += f.keywords[i].text + ""
}
confirm(set)
}
</script>
</head>
<body>
<form name="watch" method="post" action="">
<select id="MySelect" name="keywords" onchange="watch_sel(this.form)"></select><br>
<script language="javascript">
watch_ini("黒","白","绿","赤")
</script>
<input type="text" name="word" /><br />
<input type="button" value="追加" onclick="watch_add(this.form)" />
<input type="button" value="更新" onclick="watch_mod(this.form)" />
<input type="button" value="削除" onclick="watch_del(this.form)" />
<input type="button" value="保存" onclick="watch_set(this.form)" />
</form>
</body>
</html>
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效果显示如下，自由添加功能实现。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）