Jquery單選框、複選框、下拉框動態設定預設項，及動態獲取選中項。
阿新 • • 發佈：2019-01-05
1.單選框Html程式碼：
| <div class="col-sm-7"> |
| <div class="rdio rdio-success col-sm-2"> |
| <input id="radio-success1" type="radio" name="radio" data="female"> |
| <label for="radio-success1">女</label> |
| </div> |
| <div class="rdio rdio-success col-sm-2"> |
| <input id=" |
| <label for="radio-success2">男</label> |
| </div> |
| </div> |
單選框設定預設項：
$('#radio').attr('checked', 'checked');
單選框獲取選中項：
$(':radio[name ="radio"]:checked');
2.複選框Html程式碼：
| <div
class="col-md-7"
id="limits-name |
| <div class="ckbox ckbox-theme pull-left col-md-2"> |
| <input class="limits-check" id="checkbox-type-default1" type="checkbox" data="設定"> |
| <label for="checkbox-type-default1" >資料設定</label> |
| </div> |
| <div class="ckbox ckbox-theme pull-left col-md-2"> |
| <input class |
| <label for="checkbox-type-default2" >成員管理</label> |
| </div> |
| <div class="ckbox ckbox-theme pull-left col-md-2"> |
| <input class="limits-check" id="checkbox-type-default3" type="checkbox" data="商品"> |
| <label for="checkbox-type-default3" >商品管理</label> |
| </div> |
| </div> |
複選框設定預設項：
$('#checkbox-type-default1').attr('checked', 'true');
複選框獲取選中項：
$("input[type='checkbox']").is(':checked') 返回結果:選中=true,未選中=false
| var len = $('#limits-name').find('.limits-check').length; |
| var member = []; |
| for (var j = 0; j < mlen; j++) { |
| var mvalue = $('#share-member').find('.limits-check:eq('+j+'):checked').attr('data'); |
| if(mvalue != undefined) { |
| member.push(mvalue); |
| } } |
3.下拉框Html程式碼：
| <div class="col-sm-7"> |
| <select class="education form-control input-sm mb-15"> |
| <option value="請選擇">請選擇</option> |
| <option value="博士">博士</option> |
| <option value="碩士">碩士</option> |
| <option value="大學">大學</option> |
| <option value="高中">高中</option> |
| <option value="初中">初中</option> |
| <option value="小學">小學</option> |
| </select> |
| </div> |
下拉框設定預設項：
$('.education').find('option:eq(1)').attr('selected', 'selected');
下拉框獲取選中項：
$('.education').find('option:selected')；
3.radio和checkbox
redio和checkbox裡面用checked \ checked="checked" 這兩種寫法有什麼區別 取值的方法不一樣 $('input[type="radio"]:checked')$('input[type="radio"][checked]')