1,radio分組?
只要name一樣,就是一組的,即一組中只能選擇一個,如下:?
代碼如下:
<span>group1:</span> <input type="radio" id="radio1" checked="checked" name="group1" />radio1 <input type="radio" id="radio2" name="group1" />radio2 <input type="radio" id="radio3" name="group1" />radio3 <span>group2:</span> <input type="radio" id="radio4" checked="checked" name="group2" />radio4 <input type="radio" id="radio5" name="group2" />radio5 <input type="radio" id="radio6" name="group2" />radio6
?
效果如下:??
2,獲取選中的radio節點?
使用jquery可以很方便做到,先選擇group,然后過濾出checked的,如下:?
代碼如下:
var group1 = $("[name='group1']").filter(":checked");
console.log(group1.attr("id"));
3,選中一個radio節點?
使用jquery設置checked屬性:?
?
代碼如下:$("#radio2").attr("checked", "checked");
?
4,去選中一個radio節點?
移除checked屬性:?
代碼如下:
$("#radio1").removeAttr("checked");
?
這樣做的結果可能造成一組radio中沒有一個處于選中狀態。?
5,注冊選中去選中事件?
還是使用jquery的on函數來注冊change事件,如下:?
代碼如下:
$("[name='group1']").on("change",
function (e) {
console.log($(e.target).val());
}
);
?
這樣只要group1中任何一個有選中的,就會觸發函數。
附:jquery中常見的對text,radio,checkbox獲取值,賦值的操作代碼-----
//獲取單選框radio中checked的值 //方式一 var sex=$("input[name='radio_sex']:checked").attr("value");//xxxx.value 是javascript取值方式,使用jquery取值可為:$("xxxx").val() 或者 $("xxxx").attr("value") //方式二 var sex=$("[name='radio_sex']").filter(":checked").attr("value"); $("#text_id").focus(function(){//code...}); //事件 當對象text_id獲取焦點時觸發 $("#text_id").blur(function(){//code...}); //事件 當對象text_id失去焦點時觸發 $("#text_id").select(); //使文本框的Vlaue值成選中狀態 $("input[name='radio_name'][value='要選中Radio的Value值'").attr("checked",true); //根據Value值設置Radio為選中狀態
?
?
jQuery獲取CheckBox選擇的Value值
//遍歷被選中CheckBox元素的集合 得到Value值 var hobby=''; //方式一 $("[name='hobby']").filter(":checked").each(function(){$(this).attr("value")+',';//可以使用this.value+','; 或者 $(this).val()+','; }); //方式二 $("input[name='hobby']:checked").each(function(){hobby+=this.value+','});$("#checkbox_id").attr("checked"); //獲取一個CheckBox的狀態(有沒有被選中,返回true/false) $("#checkbox_id").attr("checked",true); //設置一個CheckBox的狀態為選中(checked=true) $("#checkbox_id").attr("checked",false); //設置一個CheckBox的狀態為不選中(checked=false) $("input[name='checkbox_name']").attr("checked",$("#checkbox_id").attr("checked"));//根據3,4,5條,你可以分析分析這句代碼的意思 $("#text_id").val().split(","); //將Text的Value值以','分隔 返回一個數組
?