《jQuery判断radio、checkbox、select 是否选中和设置选中问题以及获取选中值》总结

<form>
<input type="radio" name="gender" id="man" value="男" />男
<input type="radio" name="gender" id="woman" value="女" />女
<br />
<input type="checkbox" name="math" id="math"/>数学
<input type="checkbox" name="english" id="english"/>英语
<input type="checkbox" name="chinese" id="chinese"/>语文
<br />
<select id="province">
<option value="beijing">北京</option>
<option value="hubei">湖北省</option>
<option value="hunan">湖南省</option>
<option value="guangdong">广东省</option>
</select>
<input id="btnSubmit" type="submit" value="submit" />
</form>

1. 判断radio是否被选中：

//可以通过判断radio被选中的个数长度是否为0
var len = $('input[name="gender"]:checked').length;
if(len){
    console.log('radio没有选择，请选择一个！');
}
//判断某个radio是否被选中
if($('#man:checked').length){
    console.log('你选择了男的radio');
}
//或者
if($('#man').is(':checked')){
    console.log('你选择了男的radio');
}

2. 设置radio选中：

//javascript方法：
document.getElementById("man").checked = true;
//jQuery的prop方法
$('#man').prop('checked', true);
//取消选中
$('#man').prop('checked', false);
//不建议使用以下方法
$('#man').attr('checked', true);

3. 获取radio被选中的值

$('input[name="gender"]:checked').val();
//或者
$('input[name="gender"][checked]').val();

4. 判断checkbox是否被选中：

//判断某个checkbox是否被选中，跟radio方法一样
if($('#math:checked').length){
    console.log('你选择了数学');
}
//或者
if($('input[name="math"]:checked').length){
    console.log('你选择了数学');
}
//或者
if($('#math').is(':checked')){
    console.log('你选择了数学');
}
//还有一种方法是使用javascript
if(document.getElementById("math").checked == true){
　　console.log('你选择了数学');
}
//注意：网上流传的如下这种判断方法是不恰当的，与jQuery版本有关
if($('#math').attr('checked') == true)
if($('#math').attr('checked') == undefined)
if($('#math').attr('checked') == 'checked')

5. 设置checkbox选中:

/***跟radio的方法一样***/
//javascript方法：
document.getElementById("math").checked = true;
//jQuery的prop方法
$('#math').prop('checked', true);
//取消选中
$('#math').prop('checked', false);
//不建议使用以下方法
$('#math').attr('checked', true);

6. select的取值、选中

//获取当前选中项的值
 
$("#province").val();
 
//获取当前选中项的text
 
$("#province").find("option:selected").text();
 
//设置value值为guangdong的项选中
 
$("#province").val('guangdong');
 
//设置text为广东的项选中
 
$(".selector").find("option[text='广东']").attr("selected",true);