一、radio
<pre>
<input type="radio" name="modeClass" checked value="a"> aa
<input type="radio" name="modeClass" value="b"> bb
<input type="radio" name="modeClass" value="c"> cc
<input type="radio" name="modeClass" value="d"> dd
</pre>
1、設(shè)置radio選中
$('input:radio').eq(1).attr('checked', 'true');
根據(jù)索引
$("input:radio[value='a']").attr('checked','true');
根據(jù)value
2寥掐、獲取radio選中
$("input[name='modeClass']:checked").val();
二哪审、checkbox
<pre>
<input type="checkbox" name="createChoice" id="create-choice"> 是否顯示
</pre>
1毫痕、設(shè)置checkbox選中
$("input[name='createChoice']").prop("checked", 'true');
2寒瓦、取消checkbox選中
$("input[name='createChoice']").removeAttr("checked");
3、獲取checkbox狀態(tài)(是否被選中)
$("input[name='createChoice']:checked").length;
length > 0 ? 被選中 : 未被選中
三柏锄、select
<pre>
<select id="test">
<option value="一">11</option>
<option value="二">22</option>
<option value="三">33</option>
</select>
</pre>
1酿箭、設(shè)置select選中
$(".selector").val("三");
根據(jù)value值
<pre>
$("#test option").each(function(i,n){
if($(n).text() == "22"){
$(n).attr("selected",true);
}
});
</pre>
根據(jù)text值
$("#test").get(0).selectedIndex = 1 ;
根據(jù)索引
2、獲取select選中
$("#test").find("option:selected").text();
選中的文本
$("#test").val();
選中的value值
$("#test").get(0).selectedIndex;
選中的index(索引)
3趾娃、select重置
var s=document.getElementById("test")
s.options[s.selectedIndex].removeAttribute("selected");
$("#demo").val("一");
4缭嫡、select禁用
$("#test").prop("disabled", true);
5、select啟用
$("#test").prop("disabled", false);
6抬闷、select添加監(jiān)聽事件
$("#test").change(function(){});
選擇option項(xiàng)時觸發(fā)
四妇蛀、select2
<pre>
$("#test").select2({
language: "zh-CN",
theme: "classic",
width: 200
})
</pre>
1、設(shè)置select選中
$("#test").val("三").trigger("change");
根據(jù)value值
2笤成、獲取select選中
$("#test").select2("data");
獲取value與text(對象形式 : id即value)
其他同 三评架、select
使用select2的原因:
1、支持模糊查詢
2疹启、兼容IE8
官網(wǎng)地址:https://select2.github.io/