你的位置:
问答吧
-> JavaScript
-> 问题详情
jquery取的select对象
我想取被选中的value和text可以用$("#sel option:selected").val()和$("#sel option:selected").text(),但如果要取为被选中的该怎么做呢?如果我想添加一行、修改一行、删除一行、删除所有option,应该怎么做?
最后:这个ID:sel 后面的option是他的选项的意思吗?还有什么属性?有什么文档是专门介绍jquery的select对象的?请各位支招~多谢
作者: zoutuo
发布时间: 2010-08-04
sel 后面的option是他的选项
取的是集合,怎么删?不就是remove就行了吗?
作者: suiye007
发布时间: 2010-08-04
网上查找相关文档就行了吧
作者: myhope88
发布时间: 2010-08-04
问题很多……
1.如果要取为被选中的该怎么做
遍历options没被选中拿好出来
2.如果我想添加一行、修改一行、删除一行、删除所有option
options.add(option)方法向集合里添加一项option对象
options.remove(index)方法移除options集合中的指定项
options.length=0;直接删除所有选项
3.sel 后面的option是他的选项的意思吗?还有什么属性?
虽然不知道你在说什么,不是选项的意思
4.有什么文档是专门介绍jquery的select对象的?
要搞清楚所属关系,select 是属于js 不是属于jquery,jquery只是封装了一些有用的js操作
http://www.w3cschool.cn/dom_obj_select.asp.htm
http://www.w3cschool.cn/coll_select_options.asp.htm
作者: stayalive
发布时间: 2010-08-04
引用 3 楼 stayalive 的回复:
问题很多……
1.如果要取为被选中的该怎么做
遍历options没被选中拿好出来
2.如果我想添加一行、修改一行、删除一行、删除所有option
options.add(option)方法向集合里添加一项option对象
options.remove(index)方法移除options集合中的指定项
options.length=0;直接删除所有选项
3.sel 后面的option是……
首先谢谢你的回答!
不过要指出的一点是:你所说的都是标准的JAVASCRIPT对象,用document.getElementById的方式取到的对像,这些我都会做。现在的问题是,通过用$("#ID")得到的对象是jquery给封装的对象,已经不是标准javascript对象了。文档上说的很少,只有select的赋值、取值,一些高级用法我没有找到。我就是想知道这些属性方法都是什么。
再次感谢!
作者: zoutuo
发布时间: 2010-08-04
jquery对象转换为dom对象:
$("#id")[0]
dom对象转换为jquery对象:
$(document.getElementById("id"))
添加一个选项:
$("text").appendTo($("#sel"))
删除第一项:
$("#sel options").eq(0).remove();
作者: sq_zhuyi
发布时间: 2010-08-04
CSS code
$("#sel option:selected").val()
$("#sel option:selected").text()
sel是id
$("#sel option:selected").remove()删除选中的
$("#sel option:selected").val("aaa").text("bbb");修改
$("#sel").append($("abc"))添加
作者: IBM_hoojo
发布时间: 2010-08-04
$("").val('value').text('text').appendTo($(sel));
$(sel)[0].length=0;
作者: stayalive
发布时间: 2010-08-04
上面已经解答得差不多了,我再补充一下,选择未被选中的
JScript code
$('#sel option:not(:selected)')
作者: hustcyb
发布时间: 2010-08-04
/*
功能说明:为jquery 类库的一个插件,主要实现对select的操作
*/
(function($){
//得到select项的个数
$.fn.selectSize = function(){
return $(this).get(0).options.length;
}
//获取选中项的索引
$.fn.getSelectedIndex=function(){
return $(this).get(0).selectedIndex;
}
//获取选中项的值
$.fn.getSelectedValue=function(){
if(this.selectSize()==0){
return "下拉框中无选中项";
}else{
return $(this).val();
}
}
//获取当前选项的文本
$.fn.getSelectedText=function(){
if(this.selectSize()==0){
return "下拉框中无选中项";
}else{
var index=this.getselectedIndex();
return $(this).get(0).options[index].text;
}
}
//设置值为value的项为选中
$.fn.setSelectedValue=function(value){
$(this).get(0).value=value;
}
//设置select项为text的项为选中
$.fn.setSelectedText=function(text){
var isExist=false;
var count=this.selectSize();
for(var i=0;i
if($(this).get(0).options[i].text==text){
$(this).get(0).options[i].selected=true;
isExist=true;
break;
}
}
if(!isExist){
alert("下拉框中不存在该项!");
}
}
//设置选中指定索引项
$.fn.setSelectIndex=function(index){
var count=this.selectSize();
if(index>=count||index<0){
alert("索引超出范围!");
}else{
$(this).get(0).selectedIndex=index;
}
}
//判断是否存在值为value的项
$.fn.isExistItem=function(value){
var isExist=false;
var count=this.selectSize();
for(var i=0;i
if($(this).get(0).options[i].value=value){
isExist=true;
break;
}
}
return isExist;
}
//向select添加一项 显示内容为text,值为value 如果该项项值存在,则提示
$.fn.addOption=function(text,value){
if(this.isExistItem(value)){
alert("待添加项已存在!");
}else{
$(this).get(0).options.add(new Option(text,value));
}
}
//删除值为value的项 如果该项不存在则提示
$.fn.removeItem=function(value){
if(this.isExistItem(value)){
var count=this.selectSize();
for(var i=0;i
if($(this).get(0).options[i].value=value){
$(this).get(0).remove(i);
break;
}
}
}else{
alert("待删除的项不存在!");
}
}
//删除指定索引项
$.fn.removeIndex=function(index){
var count=this.selectSize();
if(index>=count||index<0){
alert("索引超出范围!");
}else{
$(this).get(0).remove(index);
}
}
//删除选定项
$.fn.removeSelected=function(){
var index=$(this).get(0).selectedIndex;
this.removeIndex(index);
}
//删除所有项
$.fn.removeAll=function(){
$(this).get(0).options.length=0;
}
//获取slect所有option对象
$.fn.getOptions=function(){
var array=new Array();
var count=this.selectSize();
for(var i=0;i
array[i]=$(this).get(0).options[i];
}
return array;
}
//向selct中添加array或json对象中包含的所有option项
$.fn.addOptionsByArray=function(array){
for(var i=0;i
$(this).get(0).options.add(new Option(array[i].text,array[i].value));
}
}
//向select中添加json对象中包含的所有option项
$.fn.addOptionsByJson=function(json){
var jsonObj;
if(typeof json=='string'){
jsonObj=eval(json);
}else if(typeof json=='object'){
jsonObj=json;
}else{
alert('数据格式不正确,无法向select中添加数据!');
}
for(var i=0;i
$(this).get(0).options.add(new Option(jsonObj[i].text,jsonObj[i].value));
}
}
})(jQuery);
不知道对你有没有帮助!
作者: list8477
发布时间: 2010-08-04
学习了
作者: SK_Aqi
发布时间: 2010-08-04
引用 9 楼 list8477 的回复:
/*
功能说明:为jquery 类库的一个插件,主要实现对select的操作
*/
(function($){
//得到select项的个数
$.fn.selectSize = function(){
return $(this).get(0).options.length;
}
//获取选中项的索引
$.fn.getSelectedIndex=fu……
十分感谢您提供的JS代码,不过看每一个方法,好像是把所有jQuery对象都转换为普通dom对象了吧?
不过,方法很好,感谢!
作者: zoutuo
发布时间: 2010-08-08
引用 8 楼 hustcyb 的回复:
上面已经解答得差不多了,我再补充一下,选择未被选中的
JScript code
$('#sel option:not(:selected)')
请问 然后怎么取值啊,没有val(),text()
作者: zoutuo
发布时间: 2010-08-08
引用 7 楼 stayalive 的回复:
$("").val('value').text('text').appendTo($(sel));
$(sel)[0].length=0;
谢谢~
作者: zoutuo
发布时间: 2010-08-08
$('#sel option:not(:selected)').each(function(){
$(this).val();
$(this).text();
});
作者: list8477
发布时间: 2010-08-08
var sel=$('#sel option:not(:selected)');
sel_length=sel.length;
for(var i=0;i
sel_value=sel.eq(i).val();
sel_text=sel.eq(i).text();
}
这两种方法差不多的
作者: list8477
发布时间: 2010-08-08