JQuery 應用篇

201706
1.取得table中的td欄位資料。
//jquery-1.11.3.js
$('#table1 > tbody > tr').each(function () {
//nth-child(3)取得第4個欄位資料
//$(this).find('td:nth-child(3)').text().trim()
 //如果要取得欄位中的TextBox就使用eq，取得第5個欄位的input
 //$(this).find('td:eq(4) input[type="text"]').val();
});
2.取得table中第一列之後的所有資料。
通常第一列會是表頭，如果要取得第一列之後的資料列，請使用下方的程式碼。
//:not排除、:first表格的第一列
//:not(:first)除了表格的第一行，其他的資料列都要
$('#table1 > tbody > tr:not(:first)').each(function () {
...
});

201705
1.檢查元素存不存在可以使用length來判斷，等於0不存在、>0代表存在。
if ($('#span_mess').length > 0) {
  //存在
}else{
  //不存在
};

201512
1.設定某個容器底下的checkbox全部勾選、全部取消(此例以table底下的checkbox為例)
//使用 jquery 版本v1.8.2
function CB1_checked(str_pid, int_dis) {
if (int_dis==1) {
$('#' + str_pid + ' :input[type="checkbox"]').attr('checked', true); //全部勾選
} else {
$('#' + str_pid + ' :input[type="checkbox"]').attr('checked', false); //全部取消
};
};

201411
1. 移除屬性(removeAttr)
$('#button1').removeAttr('onclick'); //移除button1 onclick

2. readonly
$('#id1').attr('readonly',true);

201406
1. HTML radio
1-1. 取得 radio 是否有選取項目
var str_iden=$('input[type="radio"][name="iden"]:checked').val();
if (str_iden==undefined){
    alert('您的身份尚未填寫');
    return false;  //在script標籤中，回傳false 會有終止程式執行的效果
};

1-2. radio 單選某個項目
$('input[type="radio"][name="iden"][value="1"]').attr("checked",true);

1-3. radio 停用與啟用
$('#input[type="radio"][name="iden"]').attr('disabled',true); //停用

1-4. 取得class是sall的元素，底下input type是radio，其值是1的項目(個人覺得如果是使用asp.net建議使用prop)。
$('[class="sall"] input[type="radio"][value="1"]').prop("checked", true);

2. HTML Checkbox
2-1. checkbox 是否有勾選此項目(適用於單一一個checkbox)
法1.
if ($('input[type="checkbox"][name="tt"]').attr('checked')){
   alert('您已勾選此項目');
}else{
   alert('您已取消此項目');
};

法2.(適用於JQuery 1.6以後的版本)
將 $('input[type="checkbox"][name="tt"]').attr('checked') 改成
$('input[type="checkbox"][name="tt"]').prop('checked')

2-2. 設定CheckBox勾選
$('input[type="checkbox"][name="tt"]').attr('checked',true); //可用在低版本的JQuery

補充：使用 attr('checked', true) 與 prop("checked", true)差別在於attr('checked', true)會在標籤裡增加checked的屬性，而 prop("checked", true)則不會在標籤裡增加checked屬性。

3. HTML Select
2-1. 取得下拉式選單選取的值及項目
$('select[name="s1"] option:selected').val();  //value
$('select[id="DDL1"] option:selected').text(); //項目

2-2. 設定下拉式選單項目為選取狀態(適用於JQuery低版本)
$('select[name="Area"] option[value="100"]').attr("selected",true);

2018/03/26 如果我的Html Select有設定class，例如我的class="hello"，我也可以這樣子去設定Select要停留在哪一個選項。(使用的jquery版本是jquery-1.11.3)
$('.hello').val('0');