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 相关文章推荐
JS弹出层的显示与隐藏示例代码
Dec 27 Javascript
javascript原始值和对象引用实例分析
Apr 25 Javascript
javascript实现简单的全选和反选功能
Jan 05 Javascript
微信小程序 网络API 上传、下载详解
Nov 09 Javascript
js返回顶部实例分享
Dec 21 Javascript
js实现图片360度旋转
Jan 22 Javascript
js 获取json数组里面数组的长度实例
Oct 31 Javascript
基于vue2实现左滑删除功能
Nov 28 Javascript
vue+element-ui+ajax实现一个表格的实例
Mar 09 Javascript
JavaScript使用prototype原型实现的封装继承多态示例
Aug 31 Javascript
jQuery实现的网站banner图片无缝轮播效果完整实例
Jan 28 jQuery
TypeScript魔法堂之枚举的超实用手册
Oct 29 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
第十五节--Zend引擎的发展
2006/11/16 PHP
PHP面向对象分析设计的经验原则
2008/09/20 PHP
php 表单验证实现代码
2009/03/10 PHP
Fedora下安装php Redis扩展笔记
2014/09/03 PHP
PHP实现服务器状态监控的方法
2014/12/09 PHP
Thinkphp3.2.3整合phpqrcode生成带logo的二维码
2016/07/21 PHP
PHP 微信扫码支付源代码(推荐)
2016/11/03 PHP
PHP面向对象程序设计之对象克隆clone和魔术方法__clone()用法分析
2019/06/12 PHP
菜单效果
2006/10/14 Javascript
JSONP跨域的原理解析及其实现介绍
2014/03/22 Javascript
JQuery弹出层示例可自定义
2014/05/19 Javascript
JavaScript中使用stopPropagation函数停止事件传播例子
2014/08/27 Javascript
jquery制作select列表双向选择示例代码
2014/09/02 Javascript
深入浅析react native es6语法
2015/12/09 Javascript
JavaScript利用Date实现简单的倒计时实例
2017/01/12 Javascript
jquery使用EasyUI Tree异步加载JSON数据(生成树)
2017/02/11 Javascript
jQuery实现简单的抽奖游戏
2017/05/05 jQuery
AngularJS实现的获取焦点及失去焦点时的表单验证功能示例
2017/10/25 Javascript
vue 实现动态路由的方法
2020/07/06 Javascript
[49:27]LGD vs OG 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
python实现删除文件与目录的方法
2014/11/10 Python
Python最基本的输入输出详解
2015/04/25 Python
Python中正则表达式的详细教程
2015/04/30 Python
深入解析Python中函数的参数与作用域
2016/03/20 Python
Python使用functools模块中的partial函数生成偏函数
2016/07/02 Python
python中实现精确的浮点数运算详解
2017/11/02 Python
解决python3 json数据包含中文的读写问题
2018/05/10 Python
对Python的zip函数妙用,旋转矩阵详解
2018/12/13 Python
从训练好的tensorflow模型中打印训练变量实例
2020/01/20 Python
python实现翻译word表格小程序
2020/02/27 Python
PAUL HEWITT手表美国站:德国北部时尚生活配饰品牌,船锚元素
2017/11/18 全球购物
说说在weblogic中开发消息Bean时的persistent与non-persisten的差别
2013/04/07 面试题
应届毕业生求职信范文
2014/07/07 职场文书
学雷锋活动简报
2015/07/20 职场文书
pytorch 使用半精度模型部署的操作
2021/05/24 Python
Elasticsearch 数据类型及管理
2022/04/19 Python