js清除select控件的所有option项

1、清空select所有option项

 代码如下 复制代码

document.getElementById("sel1").length=0;2、循环option项,逐个删除

function clearn(){  
 var ctrl2=document.getElementById("id"); 
  for(var i=0;i<ctrl2.options.length;)    {
         ctrl2.removeChild(ctrl2.options[i]);    
  }
}

2、jquery清空select选项

内容清空:

 代码如下 复制代码

jQuery("#select_id").empty(); 

jQuery获取Select选择的Text和Value:
  1. var checkText=jQuery("#select_id").find("option:selected").text();
//获取Select选择的Text
  2. var checkValue=jQuery("#select_id").val();
//获取Select选择的option Value
  3. var checkIndex=jQuery("#select_id ").get(0).selectedIndex;
//获取Select选择的索引值
  4. var maxIndex=jQuery("#select_id option:last").attr("index");
//获取Select最大的索引值
  jQuery添加/删除Select的Option项:
  1. jQuery("#select_id").append("<option value='Value'>Text</option>");
//为Select追加一个Option(下拉项)
  2. jQuery("#select_id").prepend("<option value='0'>请选择</option>");
//为Select插入一个Option(第一个位置)
  3. jQuery("#select_id option:last").remove();
//删除Select中索引值最大Option(最后一个)
  4. jQuery("#select_id option[index='0']").remove();
//删除Select中索引值为0的Option(第一个)
  5. jQuery("#select_id option[value='3']").remove();
//删除Select中Value='3'的Option
  6. jQuery("#select_id option[text='4']").remove();
//删除Select中Text='4'的Option

时间: 2024-08-01 08:42:03

js清除select控件的所有option项的相关文章

js操作select控件大全(包含新增、修改、删除、选中、清空、判断存在等)

原文:js操作select控件大全(包含新增.修改.删除.选中.清空.判断存在等) js操作select控件大全(包含新增.修改.删除.选中.清空.判断存在等) js 代码// 1.判断select选项中 是否存在Value="paraValue"的Item        function jsSelectIsExitItem(objSelect, objItemValue) {            var isExit = false;            for (var i

JS对select控件option选项的增删改查示例代码_javascript技巧

Javascript 操作select是表单中常见的一种,下面介绍几种常用的JS动态操作select中的各种方法: 复制代码 代码如下: //动态创建select function createSelect() { var mySelect = document.createElement("select"); mySelect.id = "mySelect"; document.body.appendChild(mySelect); } 复制代码 代码如下: //

js操作select控件的几种方法_表单特效

1判断select选项中 是否存在Value="paraValue"的Item 2向select选项中 加入一个Item 3从select选项中 删除一个Item 4删除select中选中的项 5修改select选项中 value="paraValue"的text为"paraText" 6设置select中text="paraText"的第一个Item为选中 7设置select中value="paraValue&qu

js 模拟select控件实例代码

请选择游戏名称 搜索 地下城与勇士 魔兽世界(国服) 魔兽世界(台服) 热血江湖 神鬼传奇 大话西游II QQ幻想世界

js+CSS实现模拟华丽的select控件下拉菜单效果_javascript技巧

本文实例讲述了js+CSS实现模拟select控件的下拉菜单效果.分享给大家供大家参考.具体如下: 这是一个JS+CSS技术实现的Select控件效果,模拟出来的,比默认的Select更漂亮,有了这个模板,你修改Select就更方便了,由此你也可以将其制作成CSS下拉菜单,在兼容性方面暂未测试,在IE8下没问题. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-css-select-control-style-codes/ 具体代码如下:

javascript-js中使用select控件时需要加上form吗?

问题描述 js中使用select控件时需要加上form吗? 在页面中,有表单form1 里面有一个select控件 名称为category.而在js中设置select时,如果document.category.options[tt]=new Option(""""");就无法创建成功. 但是使用document.form1.category.options[tt]=new Option(""""");就可以

轻松使用jQuery双向select控件Bootstrap Dual Listbox_jquery

本文主要为大家介绍了双向select控件Bootstrap Dual Listbox的使用方法,Bootstrap Dual列表是一个为响应Twitter优化的列表框插件,它可以用在所有的现代浏览器和触摸设备上,分享给大家,具体如下: 效果图: 一.使用 1.引用css和js文件 <link href="scripts/bootstrap-3.3.5-dist/css/bootstrap.min.css" rel="stylesheet" /> <

HTML的select控件美化

原文:HTML的select控件美化 HTML的select控件美化 CSS: .div-select { border: solid 1px #999; height: 40px; line-height: 40px; cursor: default; } .div-select-text { float: left; background-color: #fff; height: 100%; word-break: keep-all; overflow: hidden; cursor: de

Vue.js表单控件实践_javascript技巧

最近项目中使用了vue替代繁琐的jquery处理dom的数据更新,个人非常喜欢,所以就上官网小小地实践了一把. 以下为表单控件的实践,代码敬上,直接新建html文件,粘贴复制即可看到效果 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>PlayAround2 Have Fun</title> <sc