jQuery操作select的常用方法

jQuery这个框架方便了我们对于HTML元素的操作,本来以为自己对于Select操作也算是熟悉了,但上午在测试的时候才发现自己了解的还真不多。 看了一下jQuery的一些方法后,理出了一些常用的方法,列在下面: JavaScript代码 //获取第一个option的值   $('#test option:first').val();   //最后一个option的值    $('#test option:last').val();   //获取第二个option的值   $...

jQuery这个框架方便了我们对于HTML元素的操作,本来以为自己对于Select操作也算是熟悉了,但上午在测试的时候才发现自己了解的还真不多。

看了一下jQuery的一些方法后,理出了一些常用的方法,列在下面:

JavaScript代码
//获取第一个option的值  
$(‘#test option:first’).val();  
//最后一个option的值   
$(‘#test option:last’).val();  
//获取第二个option的值  
$(‘#test option:eq(1)’).val();  
//获取选中的值  
$(‘#test’).val();  
$(‘#test option:selected’).val();  
//设置值为2的option为选中状态  
$(‘#test’).attr(‘value’,’2′);  
//设置第一个option为选中  
$(‘#test option:last’).attr(‘selected’,'selected’);  
$(“#test”).attr(‘value’ , $(‘#test option:last’).val());  
$(“#test”).attr(‘value’ , $(‘#test option’).eq($(‘#test option’).length – 1).val());  
//获取select的长度  
$(‘#test option’).length;  
//添加一个option  
$(“#test”).append(“<option value=’9′>ff</option>”);  
$(“<option value=’9′>ff</option>”).appendTo(“#test”);  
//添除选中项  
$(‘#test option:selected’).remove();  
//指定项选中  
$(‘#test option:first’).remove();  
//指定值被删除  
$(‘#test option’).each(function(){  
    if( $(this).val() == ’5′){  
        $(this).remove();  
    }  
});  
$(‘#test option[value=5]‘).remove();  
  
//获取第一个Group的标签  
$(‘#test optgroup:eq(0)’).attr(‘label’);  
//获取第二group下面第一个option的值   
$(‘#test optgroup:eq(1) :o ption:eq(0)’).val();

转载请注明文章转载自:网站前端,web前端,前端脚本,前端优化|时代前端 [http://www.52shidai.com]
本文链接地址:jQuery操作select的常用方法

标签:,

发表评论

*

* 绝不会泄露



Copyright © 网站前端,web前端,前端脚本,前端优化|时代前端 and WPYOU All Rights Reserved.

Powered by Wordpress and Theme by WPYOU