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 相关文章推荐
JS与框架页的操作代码
Jan 17 Javascript
JavaScript中的DSL元编程介绍
Mar 15 Javascript
JavaScript实现把数字转换成中文
Jun 29 Javascript
基于JavaScript实现图片点击弹出窗口而不是保存
Feb 06 Javascript
Js得到radiobuttonlist选中值的两种方法(推荐)
Aug 25 Javascript
详细谈谈AngularJS的子级作用域问题
Sep 05 Javascript
微信小程序 获取当前地理位置和经纬度实例代码
Dec 05 Javascript
微信小程序 跳转方式总结
Apr 20 Javascript
JS获取填报扩展单元格控件的值的解决办法
Jul 14 Javascript
JavaScript如何对图片进行黑白化
Apr 10 Javascript
解决vue同一slot在组件中渲染多次的问题
Sep 06 Javascript
基于JavaScript实现每日签到打卡轨迹功能
Nov 29 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
我的论坛源代码(八)
2006/10/09 PHP
让PHP支持页面回退的两种方法[转]
2007/02/14 PHP
ThinkPHP类似AOP思想的参数验证的实现方法
2019/12/18 PHP
Javascript中的常见排序算法
2007/03/27 Javascript
javaScript checkbox 全选/反选及批量删除
2010/04/28 Javascript
页面调用单个swf文件,嵌套出多个方法。
2011/11/21 Javascript
基于百度地图实现产品销售的单位位置查看功能设计与实现
2016/10/21 Javascript
Node.js中路径处理模块path详解
2016/11/14 Javascript
javascript 初学教程及五子棋小程序的简单实现
2017/07/04 Javascript
vue打包后显示空白正确处理方法
2017/11/01 Javascript
Parcel 打包示例(React HelloWorld)
2018/01/16 Javascript
vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用
2018/04/13 Javascript
Vue中的字符串模板的使用
2018/05/17 Javascript
解决Vue.js由于延时显示了{{message}}引用界面的问题
2018/08/25 Javascript
详解JSON和JSONP劫持以及解决方法
2019/03/08 Javascript
弱类型语言javascript中 a,b 的运算实例小结
2019/08/07 Javascript
vue中使用element ui的弹窗与echarts之间的问题详解
2019/10/25 Javascript
vue实现数据控制视图的原理解析
2020/01/07 Javascript
JS深入学习之数组对象排序操作示例
2020/05/01 Javascript
python中的列表推导浅析
2014/04/26 Python
Python实现上下班抢个顺风单脚本
2018/02/07 Python
Python调用C++,通过Pybind11制作Python接口
2018/10/16 Python
Python 实现两个列表里元素对应相乘的方法
2018/11/14 Python
Python比较配置文件的方法实例详解
2019/06/06 Python
django如何自己创建一个中间件
2019/07/24 Python
tesserocr与pytesseract模块的使用方法解析
2019/08/30 Python
python迭代器常见用法实例分析
2019/11/22 Python
移动端HTML5实现文件上传功能【附代码】
2016/03/25 HTML / CSS
Ibatis如何使用动态表名
2015/07/12 面试题
使用Vue.js和MJML创建响应式电子邮件
2021/03/23 Vue.js
面试后的英文感谢信
2014/02/01 职场文书
学校节能减排倡议书
2014/05/16 职场文书
防卫过当辩护词
2015/05/21 职场文书
写作之关于描写老人的好段摘抄
2019/11/14 职场文书
用基于python的appium爬取b站直播消费记录
2021/04/17 Python
Python爬虫之爬取某文库文档数据
2021/04/21 Python