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 相关文章推荐
爱恋千雪-US-AscII加密解密工具(网页加密)下载
Jun 06 Javascript
JavaScript 自动完成脚本整理(33个)
Oct 20 Javascript
jquery 学习之二 属性相关
Nov 23 Javascript
js如何实现设计模式中的模板方法
Jul 23 Javascript
JS+CSS实现带小三角指引的滑动门效果
Sep 22 Javascript
Bootstrap组件系列之福利篇几款好用的组件(推荐二)
Jul 12 Javascript
彻底解决 webpack 打包文件体积过大问题
Jul 07 Javascript
Node.js log4js日志管理详解
Jul 31 Javascript
浅谈Webpack核心模块tapable解析
Sep 11 Javascript
详解Vue-Router源码分析路由实现原理
May 15 Javascript
JS实现躲避粒子小游戏
Jun 18 Javascript
vue基于better-scroll仿京东分类列表
Jun 30 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初学者的8点有效建议
2010/11/20 PHP
基于MySQL到MongoDB简易对照表的详解
2013/06/03 PHP
php实现微信发红包
2015/12/05 PHP
php封装的图片(缩略图)处理类完整实例
2016/10/19 PHP
PHP中散列密码的安全性分析
2019/07/26 PHP
图片完美缩放
2006/09/07 Javascript
JS应用之禁止抓屏、复制、打印
2008/02/21 Javascript
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
2012/06/14 Javascript
使用闭包对setTimeout进行简单封装避免出错
2013/07/10 Javascript
JS实现程序暂停与继续功能代码解读
2013/10/10 Javascript
对table和ul实现js分页示例分享
2014/02/24 Javascript
jQuery中map()方法用法实例
2015/01/06 Javascript
node.js请求HTTPS报错:UNABLE_TO_VERIFY_LEAF_SIGNATURE\的解决方法
2016/12/18 Javascript
基于bootstrap实现收缩导航条
2017/03/17 Javascript
nodejs mysql 实现分页的方法
2017/06/06 NodeJs
vue实现样式之间的切换及vue动态样式的实现方法
2017/12/19 Javascript
解决vue页面刷新或者后退参数丢失的问题
2018/03/13 Javascript
vue实现绑定事件的方法实例代码详解
2019/06/20 Javascript
小程序实现横向滑动日历效果
2019/10/21 Javascript
jQuery擦除插件eraser使用方法详解
2020/01/11 jQuery
JS原形与原型链深入详解
2020/05/09 Javascript
[55:54]FNATIC vs EG 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
python访问纯真IP数据库的代码
2011/05/19 Python
python实现判断数组是否包含指定元素的方法
2015/07/15 Python
Python编程实现输入某年某月某日计算出这一天是该年第几天的方法
2017/04/18 Python
Python实现字典(dict)的迭代操作示例
2018/06/05 Python
使用Tensorflow实现可视化中间层和卷积层
2020/01/24 Python
Python中常用的高阶函数实例详解
2020/02/21 Python
将pymysql获取到的数据类型是tuple转化为pandas方式
2020/05/15 Python
python实现斗地主分牌洗牌
2020/06/22 Python
python中random.randint和random.randrange的区别详解
2020/09/20 Python
HTML5 video播放器全屏(fullScreen)方法实例
2015/04/24 HTML / CSS
利用异或运算实现两个无符号数的加法运算
2013/12/20 面试题
爱心捐助倡议书
2014/05/19 职场文书
社区反邪教工作方案
2014/06/16 职场文书
周一早安温馨问候祝福语!
2019/07/15 职场文书