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 相关文章推荐
ext实现完整的登录代码
Aug 08 Javascript
jquery 应用代码 方便的排序功能
Feb 06 Javascript
基于jquery实现的服务器验证控件的启用和禁用代码
Apr 27 Javascript
限制文本框输入N个字符的js代码
May 13 Javascript
JavaScript设计模式之代理模式介绍
Dec 28 Javascript
web前端开发JQuery常用实例代码片段(50个)
Aug 28 Javascript
分享经典的JavaScript开发技巧
Nov 21 Javascript
AngularJS中$http使用的简单介绍
Mar 17 Javascript
详解Angular4 路由设置相关
Aug 26 Javascript
通过JS深度判断两个对象字段相同
Jun 14 Javascript
解决layer 动态加载select 失效的问题
Sep 18 Javascript
微信小程序实现选项卡滑动切换
Oct 22 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部分常见问题总结
2006/10/09 PHP
php Http_Template_IT类库进行模板替换
2009/03/19 PHP
关于页面优化和伪静态
2009/10/11 PHP
php获取、检查类名、函数名、方法名的函数方法
2015/06/25 PHP
Yii 访问 Gii(脚手架)时出现 403 错误
2018/06/06 PHP
checkbox全选/取消全选以及checkbox遍历jQuery实现代码
2009/12/02 Javascript
js 中 document.createEvent的用法
2010/08/29 Javascript
如何用ajax来创建一个XMLHttpRequest对象
2012/12/10 Javascript
详解JS 比较两个Json对象的值是否相等的实例
2013/11/20 Javascript
SeaJS入门教程系列之SeaJS介绍(一)
2014/03/03 Javascript
javascript限制用户只能输汉字中文的方法
2014/11/20 Javascript
jQuery使用removeClass方法删除元素指定Class的方法
2015/03/26 Javascript
基于Jquery和html5的7款个性化地图插件
2015/11/17 Javascript
谈谈javascript中使用连等赋值操作带来的问题
2015/11/26 Javascript
JavaScript焦点事件、鼠标事件和滚轮事件使用详解
2016/01/15 Javascript
用js控件div的滚动条,让它在内容更新时自动滚到底部的实现方法
2016/10/27 Javascript
JS回调函数简单用法示例
2017/02/09 Javascript
javascript 删除数组元素和清空数组的简单方法
2017/02/24 Javascript
JavaScript数据结构中串的表示与应用实例
2017/04/12 Javascript
JS正则表达式验证中文字符
2017/05/08 Javascript
JavaScript条件判断_动力节点Java学院整理
2017/06/26 Javascript
angular6的响应式表单的实现
2018/10/10 Javascript
JQuery获取元素尺寸、位置及页面滚动事件应用示例
2019/05/14 jQuery
js实现ajax的用户简单登入功能
2020/06/18 Javascript
python with提前退出遇到的坑与解决方案
2018/01/05 Python
使用python将多个excel文件合并到同一个文件的方法
2019/07/09 Python
python类的实例化问题解决
2019/08/31 Python
利用python Selenium实现自动登陆京东签到领金币功能
2019/10/31 Python
Python操作Excel工作簿的示例代码(\*.xlsx)
2020/03/23 Python
意外伤害赔偿协议书范本
2014/09/28 职场文书
交通事故委托书范本精选
2014/10/04 职场文书
见习报告怎么写
2014/10/31 职场文书
六五普法学习心得体会
2016/01/21 职场文书
MySQL 常见的数据表设计误区汇总
2021/06/07 MySQL
详解Java实践之建造者模式
2021/06/18 Java/Android
Windows Server 2019 域控制器安装图文教程
2022/04/28 Servers