`

SELECT框JS操作小结

 
阅读更多

1.判断SELECT是否存在值为reqVal的item.

 function checkItemIsExit(selObj,reqVal){
  	 var flag = false;
  	 for(var i=0;i<selObj.options.length;i++){
  	 	if(selObj.options[i].value==reqVal){
  	 		flag = true;
  	 		break;
  	 	}
  	 }
  	 return flag;
  }

2.给SELECT增加一个Option

function addItem(selObj,reqText,reqVal){
  	 if(checkItemIsExit(selObj,reqVal)){
  	 	alert('值为'+reqVal+'的SELECT框存在了!');
  	 }else{
		var option = new Option(reqText,reqVal);
		selObj.options.add(option);  	 	
  	 }
  }

 3.得到select的当前选中项的text

var text = selObj.options[selObj.selectedIndex].text;

 

4.选中VALUE=reqVal的SELECT的option

 function SelectItemByVal(selObj,reqVal){
	 for(var i=0;i<selObj.options.length;i++){
	 	if(selObj.options[i].value=reqVal){
	 		selObj.options[i].selected=true;
	 		break;
	 	}
	 }
 }

 5.删除VALUE=reqVal的item

 function removeItemByValue(selObj,reqVal){
	 var flag = false;
	 alert(reqVal);
	 for(var i=0;i<selObj.options.length;i++){
	 	if(selObj.options[i].value==reqVal){
	 		selObj.options.remove(i);
	 		flag = true;
	 		break;
	 	}
	 }
	 if(flag){
	 	alert('删除成功!');
	 }else{
	 	alert('删除失败!');
	 }
 }	 

 

6. 清空SELECT 框:

 function clearSel(selObj){
	 selObj.options.length=0;
}

 

7.获得当前SELECT框的值:

var value = selObj.value;

 

 更改SELECT在页面上的显示方式:

<select name="holiday" id="holiday" style="width:300px;height: 80px;" size=10>
          <option value="-1">请选择节日</option>
  </select>

 

分享到:
评论

相关推荐

    js select option对象小结

    一基础理解: var e = document.getElementById(“selectId”); e. options= new Option(“文本”,”值”) ;...selectedIndex属性——–当前被选中的框中的文本的索引值,此索引值是内存自动分配的(0,

    基于BootStrap Metronic开发框架经验小结【三】下拉列表Select2插件的使用

    在上篇基于BootStrap Metronic开发框架经验小结【二】列表分页处理和插件JSTree的使用,介绍了数据的分页处理,使用了Bootstrap Paginator插件,另外对树形列表,采用了JSTree插件,本篇继续介绍在编辑页面中常用到...

    Select2.js下拉框使用小结

    用了这么久的Select2插件,也该写篇...文件需要引入select2.full.js、select2.min.css(4.0.1版本)和jquery.1.8.3及以上 最新版本的select2如果引用的jquery版本较低的话,某些功能无法正常使用。比如:清除功能allo

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part1.rar

    第一部分 深入理解DOM脚本编程  第1章 遵循最佳实践   1.1 不唐突和渐进增强   1.2 让JavaScript运行起来   1.2.1 把行为从结构中分离出来   1.2.2 不要版本检测  ... 12.9 小结

    javascript 框架小结 个人工作经验

    /**************************************************************************************** 作者:萧 枫 QQ:77182997 MSN:xiaofengnet@hotmail.com Email:xiaofengnet@163.com 网址:http://www.d369.net 请保留...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part3.rar

    第一部分 深入理解DOM脚本编程  第1章 遵循最佳实践   1.1 不唐突和渐进增强   1.2 让JavaScript运行起来   1.2.1 把行为从结构中分离出来   1.2.2 不要版本检测  ... 12.9 小结

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part2.rar

    第一部分 深入理解DOM脚本编程  第1章 遵循最佳实践   1.1 不唐突和渐进增强   1.2 让JavaScript运行起来   1.2.1 把行为从结构中分离出来   1.2.2 不要版本检测  ... 12.9 小结

    php网络开发完全手册

    11.1.6 下拉框与列表框标签select 172 11.2 表单数据的接收 173 11.2.1 GET方法 173 11.2.2 POST方法 176 11.3 常用表单数据的验证方法 177 11.3.1 姓名验证 177 11.3.2 日期验证 177 11.3.3 E-mail地址验证 178 ...

    JavaScript DOM高级程序设计 Part I

    6.3 小结 第七章 向应用程序中加入Ajax 7.1 组合的技术 ... 7.1.5 Ajax是正确的选择吗 7.2 为什么Ajax会破坏网站及如何解决 ... 第八章 案例研究:实现带进度条的一部分文件上传功能 第九章 通过库来提高生产...

    jQuery操作表单常用控件方法小结

    下面的JS代码列出了jQuery操作表单常用控件(包括select,radiobox,checkbox)的常用方法,相信一定有你需要的 操作radio的html代码 Radion &lt;input type="radio" name="rd" id="rd1" checked="checked" value=...

    JavaScript DOM高级程序设计 Part II

    6.3 小结 第七章 向应用程序中加入Ajax 7.1 组合的技术 ... 7.1.5 Ajax是正确的选择吗 7.2 为什么Ajax会破坏网站及如何解决 ... 第八章 案例研究:实现带进度条的一部分文件上传功能 第九章 通过库来提高生产...

    javascript 一些用法小结

    以全选为例,onclick=”[removed]allselect()”//javascript可以省略 或者将function allselect()用document.getElementById(“allselectbox”).onclick = function(); 全选: fuction allselect(){ var form = ...

    Ext Js权威指南(.zip.001

    1.6 本章小结 / 33 .第2章 从“hello world”开始 / 34 2.1 获取ext js 4 / 34 2.2 配置使用ext js库 / 35 2.3 编写“hello world”程序 / 37 2.4 关于ext.onready / 38 2.5 关于ext.blank_image_url / 40 ...

    Lotus.Domino.Web编程

    本章小结 14 第2章 使用表单 16 2.1 关于表单 16 2.2 在表单中使用公式 17 2.2.1 数组和多值域 18 2.2.2 公式的类型 18 2.2.3 例子:一个组合框域 20 2.2.4 例子:$$Return域的公式 22 2.3 在表单中使用Web元素 22 ...

    dominoWEB编程

    本章小结 14 第2章 使用表单 16 2.1 关于表单 16 2.2 在表单中使用公式 17 2.2.1 数组和多值域 18 2.2.2 公式的类型 18 2.2.3 例子:一个组合框域 20 2.2.4 例子:$$Return域的公式 22 2.3 在表单中使用Web元素 22 ...

    javascript实现数据双向绑定的三种方式小结

    比较老的实现方式,有点像观察者编程模式,主要思路是通过在数据对象上定义get和set方法(当然还有其它方法),调用时手动调用get或set数据,改变数据后出发UI层的渲染操作;以视图驱动数据变化的场景主要应用与input...

    jQuery语法总结和注意事项小结

    一、简介 1.1、概述 随着WEB2.0及ajax思想在互联网上的快速发展传播,陆续出现了一些优秀的Js框架,其中比较著名的有Prototype、YUI、jQuery、mootools、Bindows以及国内的JSVM框架等,通过将这些JS框架应用到我们的...

Global site tag (gtag.js) - Google Analytics