jquery如何拿到一个对象_jquery取的select对象

你的位置:

问答吧

-> 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