转载:js下拉列表实现增加和移除选项
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了转载:js下拉列表实现增加和移除选项相关的知识,希望对你有一定的参考价值。
<!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下拉列表实现增加和移除选项的主要内容,如果未能解决你的问题,请参考以下文章
如何使用validate.js进行动态添加和移除表单验证信息