<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> ?<head> ???<base href="http://localhost:8080/%E7%BA%A7%E8%81%94/"> ???????<title>JaneYork</title> ???????<meta http-equiv="pragma" content="no-cache"> ???<meta http-equiv="cache-control" content="no-cache"> ???<meta http-equiv="expires" content="0"> ???????<meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> ???<meta http-equiv="description" content="This is my page"> ???<!-- ???<link rel="stylesheet" type="text/css" href="styles.css"> ???--> ?</head> ???<body> ?<select id="s1" multiple="multiple"> ?????<option>北京</option> ?????<option>上海</option> ?</select> ?<input type="text" id="txt"> ?<input type="button" value="添加" id="addbtn" onclick="add()"> ?<input type="button" value="移除" id="removebtn" onclick="remove()"> ?</body>//主要功能实现 ?<script> ?//添加按钮功能实现 ?????function add(){ ?????//获取input文本输入狂标签 ?????????var txt = document.getElementById("txt"); ?????????//新建一个option ?????????var o = new Option(); ?????????//将文本框输入的内容赋给option显示的内容 ?????????o.text = txt.value; ?????????var se = document.getElementById("s1"); ?????????//把新建的option添加进来 ?????????se.add(o); ?????} ?????//移除按钮功能实现 ?????function remove(){ ???????????//获取select标签 ?????????var se = document.getElementById("s1"); ?????????//移除当前选中项 ?????????se.remove(se.selectedIndex); ?????} ?</script></html>原文地址：http://blog.csdn.net/qq_31708763/article/details/77736671
转载：js下拉列表实现增加和移除选项
原文地址：http://www.cnblogs.com/JaneYork/p/7464964.html