javascript  删除select中的所有option的实例


Posted in Javascript onSeptember 17, 2017

javascript  删除select中的所有option的实例

方法一:

function DeleteOptions() 
  { 
    var obj = document.getElementsByTagName("select")[0]; 
    var selectOptions = obj.options; 
    var optionLength = selectOptions.length; 
    for(var i=0;i <optionLength;i++) 
    { 
      obj.removeChild(selectOptions[0]); 
    } 
  }

方法二:(那右边的Select中的所有option移到左边的Select) 

function MoveAllRightBtn(){ 
    var columnlength=$('queryColumn').length; 
    var TempText; 
    var TempValue; 
    for(var i=0;i<columnlength;i++){ 
      TempText=$('queryColumn').options[i].text; 
      TempValue=$('queryColumn').options[i].value; 
      $('queryColumn').remove(i); 
      $('SearchqqueryColumn').options.add(new Option(TempText,TempValue)); 
    } 
  }

 以上两个方法都不够好!因为它们一次性都册除不了,因为删除了一个它的$('queryColumn')在option的序号就变了!
都好的方法是:

$('SearchqqueryColumn').options.length = 0;

 或:

<script> 
function clearOption() 
{ 
  document.getElementById("testSelect").options.length = 0; 
} 
</script>

 (那右边的Select中的所有option移到左边的Select)实现如下:

function MoveAllRightBtn(){ 
    var columnlength=$('queryColumn').options.length; 
    var TempText; 
    var TempValue; 
    for(var i=0;i<columnlength;i++){ 
      TempText=$('queryColumn').options[i].text; 
      TempValue=$('queryColumn').options[i].value; 
      $('SearchqqueryColumn').options.add(new Option(TempText,TempValue)); 
    } 
    $('queryColumn').options.length = 0; 
  }

如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
静态图片的十一种滤镜效果--不支持Ie7及非IE浏览器。
Mar 06 Javascript
jQuery源码分析-03构造jQuery对象-工具函数
Nov 14 Javascript
Android中资源文件(非代码部分)的使用概览
Dec 18 Javascript
JavaScript中this详解
Sep 01 Javascript
纯js实现手风琴效果代码
Apr 17 Javascript
JS实现点击网页判断是否安装app并打开否则跳转app store
Nov 18 Javascript
手机端js和html5刮刮卡效果
Sep 29 Javascript
利用Javascript开发一个二维周视图日历
Dec 14 Javascript
在vue中封装可复用的组件方法
Mar 01 Javascript
JQuery常用简单动画操作方法回顾与总结
Dec 07 jQuery
elementui更改el-dialog关闭按钮的图标d的示例代码
Aug 04 Javascript
详解ES6实现类的私有变量的几种写法
Feb 10 Javascript
基于Node.js模板引擎教程-jade速学与实战1
Sep 17 #Javascript
浅谈函数调用的不同方式,以及this的指向
Sep 17 #Javascript
基于Bootstrap框架菜鸟入门教程(推荐)
Sep 17 #Javascript
基于js的变量提升和函数提升(详解)
Sep 17 #Javascript
利用express启动一个server服务的方法
Sep 17 #Javascript
限时抢购-倒计时的完整实例(分享)
Sep 17 #Javascript
canvas基础绘制-绚丽倒计时的实例
Sep 17 #Javascript
You might like
php网页后退不再出现过期
2007/03/08 PHP
PHP中set_include_path()函数相关用法分析
2016/07/18 PHP
ThinkPHP 5.x远程命令执行漏洞复现
2019/09/23 PHP
学习js所必须要知道的一些
2007/03/07 Javascript
json跟xml的对比分析
2008/06/10 Javascript
jQuery代码优化 选择符篇
2011/11/01 Javascript
一个JavaScript去除字符串末尾的空白实例代码
2014/09/22 Javascript
JavaScript中的类与实例实现方法
2015/01/23 Javascript
jquery实现动态改变div宽度和高度
2015/05/08 Javascript
JavaScript中数组添加值和访问值常见问题
2016/02/06 Javascript
JS获取IMG图片高宽的简单实例
2016/05/17 Javascript
浅析Nodejs npm常用命令
2016/06/14 NodeJs
Node.js中文件操作模块File System的详细介绍
2017/01/05 Javascript
基于Angular.js实现的触摸滑动动画实例代码
2017/02/19 Javascript
jQuery动态产生select option下拉列表
2017/03/15 Javascript
将jquery.qqFace.js表情转换成微信的字符码
2017/12/01 jQuery
[02:09]2018DOTA2亚洲邀请赛TNC赛前采访
2018/04/04 DOTA
python中的yield使用方法
2014/02/11 Python
Python入门篇之正则表达式
2014/10/20 Python
Python中的字典与成员运算符初步探究
2015/10/13 Python
Python松散正则表达式用法分析
2016/04/29 Python
Python内置数据结构与操作符的练习题集锦
2016/07/01 Python
python数据抓取分析的示例代码(python + mongodb)
2017/12/25 Python
Python OpenCV处理图像之滤镜和图像运算
2018/07/10 Python
Python开发的十个小贴士和技巧及长常犯错误
2018/09/27 Python
Python设计模式之简单工厂模式实例详解
2019/01/22 Python
解决Python3用PIL的ImageFont输出中文乱码的问题
2019/08/22 Python
如何将你的应用迁移到Python3的三个步骤
2019/12/22 Python
Python函数的定义方式与函数参数问题实例分析
2019/12/26 Python
Python如何使用paramiko模块连接linux
2020/03/18 Python
世界上最好的野生海鲜和有机食品:Vital Choice
2020/01/16 全球购物
单位刻章介绍信范文
2014/01/11 职场文书
2014年机关工会工作总结
2014/12/19 职场文书
护士爱岗敬业心得体会
2016/01/25 职场文书
导游词之崇武古城
2019/10/07 职场文书
解决goland 导入项目后import里的包报红问题
2021/05/06 Golang