jQuery 控制表單元素

RADIO 單選框(單選組)

Radio-A Radio-B Radio-C Radio-D Radio-E

CHECKBOX 複選框

Checkbox-A Checkbox-B Checkbox-C Checkbox-D

取得 RADIO 單選框選中的值，單選框只有一個值由 .each 找到 :checked 的元素。

var result = "";
$("input[type=radio]:checked").each(function () {
  result = $(this).val() ;
});

取得 CHECKBOX 複選框選中的值，複選框可能多個值由 .each 找到 :checked 的元素並加入陣列中。

var c=[];
$("input[type=checkbox]:checked").each(function () {
  c.push($(this).val());
});
result = c.toString();

選取 RADIO 單選框的第二個元素(第一個元素為 [0])。

$("input[type=radio]")[1].checked = true;

取消選取 RADIO 單選框的元素，在此選取屬性 true 不適合可能會選取最後一個。

$("input[type=radio]").attr("checked",false);

SELECT 下拉清單 回復

Select Option 0Select Option 1Select Option 2Select Option 3Select Option 4Select Option 5Select Option 6

取得 SELECT 下拉清單選中的文字，由 .each 找到 :selected 的 <option> 元素。

$("div.dynamically select option:selected").each(function () {
  result = $(this).text();
});

取得 SELECT 下拉清單選中的值，由 .each 找到 :selected 的 <option> 元素的值。

$("div.dynamically select option:selected").each(function () {
  result = $(this).val();
});

控制表單元素 <select> 值的設置

添加一個 <option> 項目，添加於最後。

$("select").append("<option value='NEW'>Added</option>");

在前面插入一個 <option> 項目，添加於最前面。

$("select").prepend("<option value='NULL'>PLEASE SELECT</option>");

刪除第一個(索引值最小的) <option> 項目。

$("select option:first").remove();
$("select option:first-child").remove(); /* 影響全部符合的 select 元素 */

刪除最後一個(索引值最大的) <option> 項目。

$("select option:last").remove();
$("select option:last-child").remove(); /* 影響全部符合的 select 元素 */

刪除值為 Option by 2 的 <option> 項目。

$("select option[value='Option by 2']").remove();

清空 <select> 中全部的 <option> 項目。

$("select").empty();