我想取被选中的value和text可以用$("#sel option:selected").val()和$("#sel option:selected").text(),但如果要取为被选中的该怎么做呢?如果我想添加一行、修改一行、删除一行、删除所有option,应该怎么做?
最后:这个ID:sel 后面的option是他的选项的意思吗?还有什么属性?有什么文档是专门介绍jquery的select对象的?请各位支招~多谢

解决方案 »

  1.   

    sel 后面的option是他的选项
    取的是集合,怎么删?不就是remove就行了吗?
      

  2.   

    问题很多……
    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
      

  3.   

    首先谢谢你的回答!
    不过要指出的一点是:你所说的都是标准的JAVASCRIPT对象,用document.getElementById的方式取到的对像,这些我都会做。现在的问题是,通过用$("#ID")得到的对象是jquery给封装的对象,已经不是标准javascript对象了。文档上说的很少,只有select的赋值、取值,一些高级用法我没有找到。我就是想知道这些属性方法都是什么。
    再次感谢!
      

  4.   

    jquery对象转换为dom对象:
    $("#id")[0]
    dom对象转换为jquery对象:
    $(document.getElementById("id"))添加一个选项:
    $("<option value=2>text</option>").appendTo($("#sel"))
    删除第一项:
    $("#sel options").eq(0).remove();
      

  5.   


    $("#sel option:selected").val()
    $("#sel option:selected").text()
    sel是id
    $("#sel option:selected").remove()删除选中的
    $("#sel option:selected").val("aaa").text("bbb");修改
    $("#sel").append($("<option value='1'>abc</option>"))添加
      

  6.   

    $("<option></option>").val('value').text('text').appendTo($(sel));$(sel)[0].length=0;
      

  7.   

    上面已经解答得差不多了,我再补充一下,选择未被选中的$('#sel option:not(:selected)')
      

  8.   

    /*
    功能说明:为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<count;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<count;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<count;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<count;i++){
        array[i]=$(this).get(0).options[i];
    }
    return array;
    }

    //向selct中添加array或json对象中包含的所有option项
    $.fn.addOptionsByArray=function(array){
        for(var i=0;i<array.length;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<jsonObj.length;i++){
        $(this).get(0).options.add(new Option(jsonObj[i].text,jsonObj[i].value));
    }
    }

    })(jQuery);不知道对你有没有帮助!
      

  9.   


    十分感谢您提供的JS代码,不过看每一个方法,好像是把所有jQuery对象都转换为普通dom对象了吧?
    不过,方法很好,感谢!
      

  10.   


    请问   然后怎么取值啊,没有val(),text()
      

  11.   

    $('#sel option:not(:selected)').each(function(){    $(this).val();
        $(this).text();
        
    });
      

  12.   

    var sel=$('#sel option:not(:selected)');sel_length=sel.length;
    for(var i=0;i<sel_length;i++){
        sel_value=sel.eq(i).val();
        sel_text=sel.eq(i).text();
    }
    这两种方法差不多的
      

  13.   


    你好,这个方式取不到值,请问是为什么?each那个可以。但我不想定义匿名函数~~谢谢!
      

  14.   

    each()是jquery的一个遍历函数;
    他会遍历每一个符合$('#sel option:not(:selected)')条件的对象;你说
    var sel=$('#sel option:not(:selected)');sel_length=sel.length;
    for(var i=0;i<sel_length;i++){
      sel_value=sel.eq(i).val();
      sel_text=sel.eq(i).text();
    }取不到值?
    我这为什么可以?
    你把这段代码 拿去试试<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <script type="text/javascript" src="jquery-1.4.min.js"></script>
    <script type="text/javascript" src="jquery-select.js"></script>
    <script type="text/javascript" src="1.js"></script>
    </head><body>
    <script>
    function testSel(){
        var sel=$('#sel option:not(:selected)');
    sel_length=sel.length;
    for(var i=0;i<sel_length;i++){
        alert(sel.eq(i).val());
    }
    }</script>
    <button onclick="testSel()">test</button><select id="sel">
        <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    </select></body>
    </html>
      

  15.   

    我找到原因了,是因为我$('#sel option:not(:selected)')的 option 和 :not之间有一个空格,所以得到的length==0。把空格删掉就好了,谢谢。