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 相关文章推荐
Code:findPosX 和 findPosY
Dec 20 Javascript
javascript应用:Iframe自适应其加载的内容高度
Apr 10 Javascript
使用正则替换变量
May 05 Javascript
用JavaScript编写COM组件的步骤
Mar 17 Javascript
jQuery EasyUI API 中文文档 - DataGrid数据表格
Nov 17 Javascript
js 判断一个元素是否在页面中存在
Dec 27 Javascript
js判断是否为ie的方法小结
Jan 13 Javascript
jQuery中prop()方法用法实例
Jan 05 Javascript
JavaScript中的cacheStorage使用详解
Jul 29 Javascript
Express URL跳转(重定向)的实现方法
Apr 07 Javascript
jQuery实现验证表单密码一致性及正则表达式验证邮箱、手机号的方法
Dec 05 jQuery
vue项目每30秒刷新1次接口的实现方法
Dec 04 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
PHP5中使用PDO连接数据库的方法
2010/08/01 PHP
PHP内核介绍及扩展开发指南―基础知识
2011/09/11 PHP
分享一段PHP制作的中文拼音首字母工具类
2014/12/11 PHP
javascript 命名空间以提高代码重用性
2008/11/13 Javascript
Javascript 继承机制的实现
2009/08/12 Javascript
JavaScript中setAttribute用法介绍
2013/07/20 Javascript
Javascript 遮罩层和加载效果代码
2013/08/01 Javascript
超棒的响应式布局jQuery插件Freetile.js
2014/11/17 Javascript
js实现C#的StringBuilder效果完整实例
2015/12/22 Javascript
javascript嵌套函数和在函数内调用外部函数的区别分析
2016/01/31 Javascript
利用JS生成博文目录及CSS定制博客
2016/02/10 Javascript
详解JavaScript中|单竖杠运算符的使用方法
2016/05/23 Javascript
JavaScript操作表单实例讲解(上)
2016/06/20 Javascript
JavaScript中自带的 reduce()方法使用示例详解
2016/08/10 Javascript
NodeJS中的MongoDB快速入门详细教程
2016/11/11 NodeJs
详解webpack+angular2开发环境搭建
2017/06/28 Javascript
Vue异步加载about组件
2017/10/31 Javascript
web前端vue实现插值文本和输出原始html
2018/01/19 Javascript
Javascript实现异步编程的过程
2018/06/18 Javascript
详谈js的变量提升以及使用方法
2018/10/06 Javascript
layui-laydate时间日历控件使用方法详解
2018/11/15 Javascript
JavaScript事件概念详解(区分静态注册和动态注册)
2021/02/05 Javascript
python使用Paramiko模块实现远程文件拷贝
2019/04/30 Python
Python生成六万个随机,唯一的8位数字和数字组成的随机字符串实例
2020/03/03 Python
Python图像处理二值化方法实例汇总
2020/07/24 Python
ProBikeKit德国:在线公路自行车专家
2018/06/03 全球购物
Cinque网上商店:德国服装品牌
2019/03/17 全球购物
美国名表在线商城:Ashford(支持中文)
2019/09/24 全球购物
PHP数据运算类型都有哪些
2013/11/05 面试题
最新大学生自我评价
2013/09/24 职场文书
《中国的气候》教学反思
2014/02/23 职场文书
公司司机岗位职责范本
2014/03/03 职场文书
夫妻吵架保证书
2015/05/08 职场文书
甲午大海战观后感
2015/06/02 职场文书
导游词之天津盘山
2019/11/01 职场文书
Idea连接MySQL数据库出现中文乱码的问题
2021/04/14 MySQL