1. 程式人生 > >禁用、刪除、新增、選中、設定select、radio、checkbox

禁用、刪除、新增、選中、設定select、radio、checkbox

1、操作select

1)、禁用option
• 除前2個option,其他option都禁用**
$("#selectId option:gt(1)").attr(“disabled”, “”);
• 除第1個option,其他option都禁用
$("#selectId").find(“option”).not(":first").attr(“disabled”, “”);
$("#selectId").find(“option:not(:first)”).attr(“disabled”, “”);
$("#selectId option:not(:first)").attr(“disabled”, “”);

2)、刪除option
• 除前2個option,其他option都刪除
$("#selectId option:gt(1)").remove();
• 除第1個option,其他option都刪除
$("#selectId").find(“option”).not(":first").remove();
$("#selectId").find(“option:not(:first)”).remove();
$("#selectId option:not(:first)").remove();
$("#selectId option:first").siblings().remove();
• 刪除最後一個option


$("#selectId option:last").remove();
• 刪除索引option
$("#selectId option:[index=‘0’]").remove();
• 刪除所有option
$("#selectId").empty();

3)、新增option
• 為select追加一個option
$("#selectId").append(“Text”);
• 為select插入一個option(第一個位置)
$("#selectId").prepend(“請選擇”);

4)、選中option
• 選中第一個option
$("#selectId option:first").attr(“selected”);

5)、獲取select選擇的option的text和value
• 獲取select選擇的text
$("#selectId").find(“option:selected”).text();
$("#selectId option[selected]").text();
• 獲取select選擇的value
$(“selectId”).val();
• 獲取select選擇的索引值
$(“selectId”).get(0).selectedIndex;
• 獲取select最大的索引值
$("#selectId option:last").attr(“index”);

2、操作radio

1)、獲取radio
• 獲取一組radio被選中項的值
$(‘input[name=radioName]’).val();
$(‘input[name=radioName]’).attr(“value”);
$(‘input[name=radioName][checked]’).val();
• 獲取input中的單選組radio值
$(‘input[type=radio][checked]’).val();

2)、選中radio
• 選中第2個radio
$(‘input[name=radioName]’).get(1).checked = true;
• 設定value=2的專案為當前選中項
$(“input[type=radio]”).attr(“checked”,‘2’);

3、操作checkbox

1)、獲取checkbox
• 獲取選中的多選框的value(只能獲取第一個)
$(‘input[name=checkboxName]’).val();
$(‘input[name=checkboxName]’).attr(“value”);
$(‘input[name=checkboxName][checked]’).val();
• 獲取選中的多選框的text(text外還要有一層標籤才行)
$(“input:checkbox[name=‘checkboxName’]:checked”).next().text()

2)、選中checkbox
• 打勾checkbox
$(‘input[name=checkboxName]’).attr(“checked”,“checked”);
• 不打勾checkbox
$(‘input[name=checkboxName]’).attr(“checked”,"");

3)、判斷是否已打勾
if($(‘input[name=checkboxName]’).attr(“checked”) == undefined){}