JavaScript实现动态删除列表框值的方法


Posted in Javascript onAugust 12, 2015

本文实例讲述了JavaScript实现动态删除列表框值的方法。分享给大家供大家参考。具体如下:

使用JavaScript 动态删除列表框中的值,实际运用中可能效果会比较复杂,这只是一个基本功能单元,很多都是在此基础上扩展而来,运行代码点击“删除”,会将列表框中的值一一删除,只保留一项数据。

运行效果截图如下:

JavaScript实现动态删除列表框值的方法

具体代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>删除选项</title>
<style>
<!--
form{padding:0px; margin:0px; font:14px Arial;}
p{margin:0px; padding:3px;}
input{margin:0px; border:1px solid #000000;}
-->
</style>
<script language="javascript">
function RemoveOption(Box,iNum){
 var oForm = document.forms["myForm1"];
 var oBox = oForm.elements[Box];
 oBox.options[iNum] = null; 
}
</script>
</head>
<body>
<form method="post" name="myForm1">
球类:
<p>
<select id="ball" name="ball" multiple="multiple">
 <option value="Football">足球</option>
 <option value="Basketball">篮球</option>
 <option value="Volleyball">排球</option>
</select>
</p>
<input type="button" value="删除" onclick="RemoveOption('ball',1);" />
</form>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
jQuery ReferenceError: $ is not defined 错误的处理办法
May 10 Javascript
node.js中的fs.symlinkSync方法使用说明
Dec 15 Javascript
jQuery性能优化技巧分析
Feb 20 Javascript
不间断循环滚动效果的实例代码(必看篇)
Oct 08 Javascript
JavaScript条件判断_动力节点Java学院整理
Jun 26 Javascript
浅谈FastClick 填坑及源码解析
Mar 02 Javascript
jQuery实现的点击标题文字切换字体效果示例【测试可用】
Apr 26 jQuery
vue中axios请求的封装实例代码
Mar 23 Javascript
layui实现多图片上传并限制上传的图片数量
Sep 26 Javascript
nodemon实现Typescript项目热更新的示例代码
Nov 19 Javascript
Ant Design Pro 下实现文件下载的实现代码
Dec 03 Javascript
react如何快速设置文件路径别名
Apr 28 Javascript
jQuery实现文件上传进度条特效
Aug 12 #Javascript
XML文件转化成NSData对象的方法
Aug 12 #Javascript
javascript实现点击单选按钮链接转向对应网址的方法
Aug 12 #Javascript
jQuery实现动态添加和删除一个div
Aug 12 #Javascript
JavaScript多线程详解
Aug 12 #Javascript
javascript实现在下拉列表中显示多级树形菜单的方法
Aug 12 #Javascript
JavaScript实现同一页面内两个表单互相传值的方法
Aug 12 #Javascript
You might like
PHP中Header使用的HTTP协议及常用方法小结
2014/11/04 PHP
php异步多线程swoole用法实例
2014/11/14 PHP
JavaScript与Image加载事件(onload)、加载状态(complete)
2011/02/14 Javascript
基于jquery库的tab新形式使用
2012/11/16 Javascript
node.js中的console.trace方法使用说明
2014/12/09 Javascript
JavaScript制作简易的微信打飞机
2015/03/31 Javascript
javascript中setTimeout使用指南
2015/07/26 Javascript
javascript使用Promise对象实现异步编程
2016/03/01 Javascript
深入浅出讲解ES6的解构
2016/08/03 Javascript
百度多文件异步上传控件webuploader基本用法解析
2016/11/07 Javascript
js 定位到某个锚点的方法
2016/11/19 Javascript
jQuery快速高效制作网页交互特效
2017/02/24 Javascript
详解VUE的状态控制与延时加载刷新
2017/03/27 Javascript
node thread.sleep实现示例
2018/06/20 Javascript
vue树形结构获取键值的方法示例
2018/06/21 Javascript
如何在基于vue-cli的项目自定义打包环境
2018/11/10 Javascript
jquery获取file表单选择文件的路径、名字、大小、类型
2019/01/18 jQuery
小程序实现长按保存图片的方法
2019/12/31 Javascript
[55:03]LGD vs EG 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
python实现多线程暴力破解登陆路由器功能代码分享
2015/01/04 Python
浅谈Python 集合(set)类型的操作——并交差
2016/06/30 Python
Django与JS交互的示例代码
2017/08/23 Python
Python3中正则模块re.compile、re.match及re.search函数用法详解
2018/06/11 Python
python 插入日期数据到Oracle实例
2020/03/02 Python
Python环境管理virtualenv&amp;virtualenvwrapper的配置详解
2020/07/01 Python
Python代码覆盖率统计工具coverage.py用法详解
2020/11/25 Python
一款基于css3和jquery实现的动画显示弹出层按钮教程
2015/01/04 HTML / CSS
佳能英国官方网站:Canon UK
2017/08/08 全球购物
手术室护士自我鉴定
2013/10/14 职场文书
会展策划与管理专业求职信
2014/06/09 职场文书
国际贸易专业自荐信
2014/06/10 职场文书
医生党的群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
七年级作文之雪景
2019/11/18 职场文书
导游词之安徽巢湖
2019/12/26 职场文书
详解Redis基本命令与使用场景
2021/06/01 Redis
Java方法重载和方法重写的区别到底在哪?
2021/06/11 Java/Android