管理

JQuery操作Select下拉列表

Posted on 2009-02-11 18:36  lzhdim  阅读(1071)  评论(1编辑  收藏  举报

<select name=’sel’ id=’sel’>

<option value=’1′>1</option>
<option value=’2′ selected=’selected’>我被选中了</option>
<option value=’3′>2</option>
</select>
<script>
alert($("select[@name='sel'] option[@selected]").text());
$("#sel").val(’2′);
alert($("select[@name='sel'] option[@selected]").text());
</script>

查询被选中的option中的内容当然也可以用 alert($("#sel option[@selected]").text());

稍微解释一下:
select[@name='sel'] option[@selected] 表示具有name 属性,并且该属性值为’sel’ 的select元素 里面的具有selected 属性的option 元素;可以看出有@开头的就表示后面跟的是属性。


//select选项添加

  $(''#optionAdd'').click(function(){

      var s = $(''#txtSelect'').val();

   if(s != ''''){

       s = ''<option>'' + s + ''</option>'';

       $(''#ll'').append(s);

   }else{

    alert(''不能为空'');

   }

  });

  

  //select选项删除

  $(''#optionDel'').click(function(){

   $(''#ll option[selected]'').remove();

  });

  

  //select选项修改

  $(''#optionEdit'').click(function(){

   $(''#ll option[selected]'').text(''ycj'');

  });

  

  //获取select更改后的值

  $(''#ll'').change(function(){

   $(''#txtSelect'').val($(this).val());

  });

  

  //select 元素中的比较

  $(''#optionCompare'').click(function(){

  

      //方法1

   $(''#result'').text(''no''); 

      for(i=0; i<$(''#ll option'').length; i++){

    if($(''#ll option'').eq(i).text() == $(''#txtSelect'').val()){

     $(''#result'').text(''yes''); 

    }

   }

  

      //方法2

   $(''#result'').text(''no''); 

   $(''#ll option'').each(function(){

    if($(this).text() == $(''#txtSelect'').val()){

     $(''#result'').text(''yes''); 

    }

   });

  

  });


个人感觉添加操作不理想,但暂时也找不到什么好的办法

Copyright © 2000-2022 Lzhdim Technology Software All Rights Reserved