select操作
// 1.判断select选项中 是否存在Value="paraValue"的Item
function jsSelectIsExitItem(objSelect, objItemValue) {
var isExit = false;
; i < objSelect.options.length; i++) {
if (objSelect.options[i].value == objItemValue) {
isExit = true;
break;
}
}
return isExit;
}
// 2.向select选项中 加入一个Item
function jsAddItemToSelect(objSelect, objItemText, objItemValue) {
//判断是否存在
if (jsSelectIsExitItem(objSelect, objItemValue)) {
alert("该Item的Value值已经存在");
} else {
var varItem = new Option(objItemText, objItemValue);
objSelect.options.add(varItem);
alert("成功加入");
}
}
// 3.从select选项中 删除一个Item
function jsRemoveItemFromSelect(objSelect, objItemValue) {
//判断是否存在
if (jsSelectIsExitItem(objSelect, objItemValue)) {
; i < objSelect.options.length; i++) {
if (objSelect.options[i].value == objItemValue) {
objSelect.options.remove(i);
break;
}
}
alert("成功删除");
} else {
alert("该select中 不存在该项");
}
}
// 4.删除select中选中的项
function jsRemoveSelectedItemFromSelect(objSelect) {
;
; i--){
if(objSelect[i].selected == true){
objSelect.options[i] = null;
}
}
}
// 5.修改select选项中 value="paraValue"的text为"paraText"
function jsUpdateItemToSelect(objSelect, objItemText, objItemValue) {
//判断是否存在
if (jsSelectIsExitItem(objSelect, objItemValue)) {
; i < objSelect.options.length; i++) {
if (objSelect.options[i].value == objItemValue) {
objSelect.options[i].text = objItemText;
break;
}
}
alert("成功修改");
} else {
alert("该select中 不存在该项");
}
}
// 6.设置select中text="paraText"的第一个Item为选中
function jsSelectItemByValue(objSelect, objItemText) {
//判断是否存在
var isExit = false;
; i < objSelect.options.length; i++) {
if (objSelect.options[i].text == objItemText) {
objSelect.options[i].selected = true;
isExit = true;
break;
}
}
//Show出结果
if (isExit) {
alert("成功选中");
} else {
alert("该select中 不存在该项");
}
}
// 7.设置select中value="paraValue"的Item为选中
document.all.objSelect.value = objItemValue;
// 8.得到select的当前选中项的value
var currSelectValue = document.all.objSelect.value;
// 9.得到select的当前选中项的text
var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;
// 10.得到select的当前选中项的Index
var currSelectIndex = document.all.objSelect.selectedIndex;
// 11.清空select的项
;
每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了。
比如<select class="selector"></select>
1、设置value为pxx的项选中
$(".selector").val("pxx");
2、设置text为pxx的项选中
$(".selector").find("option[text='pxx']").attr("selected",true);
这里有一个中括号的用法,中括号里的等号的前面是属性名称,不用加引号。很多时候,中括号的运用可以使得逻辑变得很简单。
3、获取当前选中项的value
$(".selector").val();
4、获取当前选中项的text
$(".selector").find("option:selected").text();
这里用到了冒号,掌握它的用法并举一反三也会让代码变得简洁。
很多时候用到select的级联,即第二个select的值随着第一个select选中的值变化。这在jquery中是非常简单的。
如:$(".selector1").change(function(){
// 先清空第二个
$(".selector2").empty();
// 实际的应用中,这里的option一般都是用循环生成多个了
var option = $("<option>").val(1).text("pxx");
$(".selector2").append(option);
});
select操作的更多相关文章
- jQuery对下拉框Select操作总结
jQuery对下拉框Select操作总结 转自网络,留做备用 jQuery获取Select元素,并选择的Text和Value: 1. $("#select_id").change( ...
- jquery select操作和联动操作
(function(){ //select操作 $.fn.loadSelect = function(opt){ opt = $.extend({}, { required:false,//为真则添加 ...
- postgresql shell发起select操作报错ERROR: relation "tablename" does not exist
最近安装了一套clourdera manager,其中hive元数据保存在postgresql中,因为今天想看一下hive的元数据信息,就登录了psql,连接到hive元数据库,发起select操作, ...
- Netty源码分析第2章(NioEventLoop)---->第6节: 执行select操作
Netty源码分析第二章: NioEventLoop 第六节: 执行select操作 分析完了selector的创建和优化的过程, 这一小节分析select相关操作 跟到跟到select操作的入口 ...
- 稀疏数据压缩查询方法:Rank & Select 操作
1.稀疏数据的例子 对于网络图对应的节点关联矩阵.数据生成的哈希表等,这些存储起来是稀疏的,这样我们就会想到需要压缩空间.但是在压缩存储空间的同时,还要支持高效的查询操作. Rank & Se ...
- 035——VUE中表单控件处理之使用vue控制select操作文字栏目列表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jquery radio、 checkbox、 select 操作
转载:http://www.haorooms.com/post/checkandselect $("input[id^='code']");//id属性以code开始的所有inpu ...
- jQuery对Select操作大集合
介绍了jQuery对Select的操作进行了详细的汇总. 1.jQuery添加/删除Select的Option项: 2.$("#select_id").append("& ...
- js jquery select 操作 获取值,选中选项,增加,修改,删除
select示例: <select id="sel"> <option value="1">one</option> < ...
随机推荐
- [POJ] 2785 4 Values whose Sum is 0(双向搜索)
题目地址:http://poj.org/problem?id=2785 #include<cstdio> #include<iostream> #include<stri ...
- MySql增加字段、删除字段、修改字段
MySql增加字段.删除字段.修改字段名称.修改字段类型 1.增加一个字段 alter table user add COLUMN new1 VARCHAR(20) DEFAULT NULL; / ...
- Keil 中关于C语言编译生成汇编代码函数名规则
在keil 中 C语言的函数有带参数和不带参数之分. 一般的资料里说fun(void)类型的函数不带参数,所以,keil编译器生成的汇编的调用地址(函数名) 为fun.这没有错.事实上,不管C语言的函 ...
- cf446C DZY Loves Fibonacci Numbers
C. DZY Loves Fibonacci Numbers time limit per test 4 seconds memory limit per test 256 megabytes inp ...
- 关于qt学习的一点小记录(1)
今日为了应付学校作业要求 决定现学qt来制作界面 毕竟c++不像在这方面c#可以那么方便 qt主要依靠信号.槽来实现类似winform中的消息 鉴于要尽快做完,故而没有细看qt 只是大概了解了下界面的 ...
- 【转】基于Qt, TUIO和TSLIB的嵌入式Linux下的多点触摸设计
这个教程描述了在嵌入式linux下使用Qt如何设置一个支持多点触摸和单点触摸的输入系统.这里假定你已经有了对应的驱动程序,驱动可以从触摸屏的厂商那里获得或者使用一个linux 内核源码中已经存在的驱动 ...
- Linux 通过HTTP进行域名更新
一.3322动态域名更新接口 接口地址 API URL http://members.3322.net/dyndns/update HTTP请求 GET /dyndns/update?hostname ...
- python3-day1(文件操作)
index: str.fomat() open file str.replace 一.新款str.fomat() 1.>>> '12'.zfill(5) '00012' 2.> ...
- poj3358数论(欧拉定理)
http://poj.org/problem?id=3358 (初始状态为分数形式)小数点进制转换原理:n / m ; n /= gcd( n , m ) ; m/= gcd( n , m ) ; n ...
- 8. 冒泡法排序和快速排序(基于openCV)
一.前言 主要讲述冒泡法排序和快速排序的基本流程,并给出代码实现,亲测可用. 二.冒泡法排序 冒泡法排序主要是将相邻两个值比较,把小的向前冒泡,大的向后沉淀,时间复杂度为O(n2).主要思想如下: 分 ...