标签:
下拉框
<select id="CategoryId" data-placeholder="资产类型" style="width:350px;" > <option value="1">硬盘</option> <option value="2">主板</option> <option value="3">CPU</option> <option value="4">网卡</option>
1、设置下拉框“硬盘”为选中
$("#CategoryId").val("1"); $("#CategoryId").find("option[text=‘硬盘‘]").attr("selected",true);
$("#CategoryId").get(0).attr("selected",true);
2、获取下拉框的值
$("#CategoryId").val(); #1
$("#CategoryId").find("option:selected").text(); #"硬盘"
3、select的级联
很多时候用到select的级联,即第二个select的值随着第一个select选中的值变化。
如:$(".selector1").change(function(){
// 先清空第二个
$(".selector2").empty();
// 实际的应用中,这里的option一般都是用循环生成多个了
var option = $("<option>").val(1).text("pxx");
$(".selector2").append(option);
});
$("#DestIdcpName").change(function() { $("#id").empty(); $.ajax({ url: url, type: "POST", data:{"params":params}, dataType: "json", success: function (list) { if (list.Return === 0) { list = list.Data; $("#"+id).append("<option value=‘‘></option>"); for (var i = 0; i < list.length; i++) { var o = "<option value=‘" + list[i][column] + "‘>" + list[i][column] + "</option>"; $("#id").append(o); } return true; } }, error: function (list) { alert(list.message); return false; } }); return true; });
复选框
<label><input type="checkbox" id="checkAll" />全选/全不选</label> <label><input name="Fruit" type="checkbox" value="1" />苹果</label> <label><input name="Fruit" type="checkbox" value="1" />苹果</label> <label><input name="Fruit" type="checkbox" value="2" />桃子 </label> <label><input name="Fruit" type="checkbox" value="3" />香蕉 </label> <label><input name="Fruit" type="checkbox" value="4" />梨 </label>
1、复选框全选/反选
用prop或者attr 都可以
$("[name=‘checkbox‘]").attr("checked",‘true‘);
$("[name=‘Fruit‘]").prop("checked",‘true‘);
/*checkbox 实现全选和反选*/ $(‘#checkAll‘).live(‘click‘,function(){ if($(this).prop(‘checked‘)){ $("[name=‘Fruit‘]").each(function(){ $(this).prop(‘checked‘, true); }); }else{ $("[name=‘Fruit‘]").each(function(){
$(this).prop(‘checked‘, false);
}); } });
2、禁用checkbox
$("input[type=‘checkbox‘]").prop({ disabled: true }); #or $("[name=‘Fruit‘]").prop({ disabled: true });
3、设置选中
$("input[name=‘Fruit‘][value=3]").prop("checked", ‘checked‘); $("input[name=‘Fruit‘][value=3]").prop("checked", ‘‘); $("input[name=‘Fruit‘]").get(2).checked = true;
4、获取选中值
$("[name=‘Fruit‘]").each(function(){ if($(this).prop(‘checked‘)) { alert($(this).val()); } });
单选框
<label><input name="IsAvailable" type="radio" value="2" />待测试 </label> <label><input name="IsAvailable" type="radio" value="1" />是</label> <label><input name="IsAvailable" type="radio" value="0" />否</label>
1、设置选中
$("input[name=‘IsAvailable‘]").get(0).checked= true; //选中“待测试” $("input[name=‘IsAvailable‘]").val(1).checked= true;//选中“待测试”
2、获取值
$("input[name=‘IsAvailable‘]:checked").val(); //2 $("input[name=‘IsAvailable‘]:checked").parent().text(); //待测试
3、禁用
$("input[name=‘IsAvailable‘][value=2]").attr("disabled","true"); //"待测试"禁止选中
标签:
原文地址:http://www.cnblogs.com/sophiading/p/4187254.html