Jquery对CheckBox, RadioButton, DropDownList取值赋值
以下Jquery代码适query1.4版本以上
CheckBox
<input type="checkbox" name="ck" id="ck1" value="1" checked="checked" /> <input type="checkbox" name="ck" id="ck2" value="2" /> <input type="checkbox" name="ck" id="ck3" value="3" /> <input type="checkbox" name="ck" id="ck4" value="4" />
//1. 获取单个checkbox选中项(三种写法): $("input:checkbox:checked").val() //或者 $("input:[type='checkbox']:checked").val(); //或者 $("input:[name='ck']:checked").val(); //2. 获取多个checkbox选中项: $("input:checkbox").each(function () { if ($(this).attr("checked") == true) { alert($(this).val()); } }); //或者 $("input:checkbox").map(function () { return $(this).val(); }).get().join(","); //3. 设置第一个checkbox 为选中值: $("input:checkbox:first").attr("checked","checked"); //或者 $("input:checkbox").eq(0).attr("checked","true"); //4. 设置最后一个checkbox为选中值: $("input:radio:last").attr("checked", "checked"); //或者 $("input:radio:last").attr("checked", "true"); //5. 根据索引值设置任意一个checkbox为选中值: $("input:checkbox).eq(索引值).attr("checked", "true");索引值=0,1,2…. //或者 $("input:radio").slice(1,2).attr("checked", "true"); //6. 选中多个checkbox: //同时选中第1个和第2个的checkbox: $("input:radio").slice(0,2).attr("checked","true"); //7. 根据Value值设置checkbox为选中值: $("input:checkbox[value='1']").attr("checked",'true"); //8. 删除Value=1的checkbox:www.2cto.com $("input:checkbox[value='1']").remove(); //9. 删除第几个checkbox: $("input:checkbox").eq(索引值).remove();//索引值=0,1,2…. //如删除第3个checkbox: $("input:checkbox").eq(2).remove(); //10.遍历checkbox: $("input:checkbox").each(function (index, domEle) { //写入代码 }); //11.全部选中 $("input:checkbox").each(function() { $(this).attr("checked", true); }); //12.全部取消选择: $("input:checkbox").each(function () { $(this).attr("checked",false); });
Radio
<input type="radio" name="rd" id="rd1" value="rd1" cherded="cherded" /> <input type="radio" name="rd" id="rd2" value="rd2" /> <input type="radio" name="rd" id="rd3" value="rd3" /> <input type="radio" name="rd" id="rd4" value="rd4" />
//1.获取选中值,三种方法都可以: $("input:radio:checked").val(); $("input[type='radio']:checked").val(); $("input[name='rd']:checked").val(); //2.设置第一个Radio为选中值: $("input:radio:first").attr("checked", "checked"); //或者 $("input:radio:first").attr("checked", "true"); //注:attr("checked","checked")= attr("checked", "true")= attr("checked", true) //3.设置最后一个Radio为选中值: $("input:radio:last").attr("checked", "checked"); //或者 $("input:radio:last").attr("checked", "true"); //4.根据索引值设置任意一个radio为选中值: $("input:radio").eq(索引值).attr("checked", "true");索引值=0,1,2…. //或者 $("input:radio").slice(1,2).attr("checked", "true"); //5.根据Value值设置Radio为选中值 $("input:radio[value='rd2']").attr("checked","true"); //或者 $("input[value='rd2']").attr("checked","true"); //6.删除Value值为rd2的Radio $("input:radio[value='rd2']").remove(); //7.删除第几个Radio $("input:radio").eq(索引值).remove();//索引值=0,1,2…. //如删除第3个Radio:$("input:radio").eq(2).remove(); //8.遍历Radio $("input:radio").each(function(index,domEle){ //写入代码 });
DropDownList
<select id="sel"> <option value="1" selected="selected">a</option> <option value="2">b</option> <option value="3">c</option> <option value="4">d</option> <option value="5">e</option> </select>
//1. 获取选中项: //获取选中项的Value值: $("select#sel option:selected").val(); //或者 $("select#sel").find("option:selected").val(); //获取选中项的Text值: $("select#seloption:selected").text(); //或者 $("select#sel").find("option:selected").text(); //2. 获取当前选中项的索引值: $("select#sel").get(0).selectedIndex; //3. 获取当前option的最大索引值: $("select#sel option:last").attr("index") //4. 获取DropdownList的长度: $("select#sel")[0].options.length; //或者 $("select#sel").get(0).options.length; //5. 设置第一个option为选中值: $("select#sel option:first").attr("selected","true") //或者 $("select#sel")[0].selectedIndex = 0; //6. 设置最后一个option为选中值: $("select#sel option:last").attr("selected","true") //7. 根据索引值设置任意一个option为选中值: $("select#sel")[0].selectedIndex =索引值;//索引值=0,1,2…. //8. 设置Value=4 的option为选中值: $("select#sel").attr("value","4"); //或者 $("select#sel option[value='4']").attr("selected", "true"); //9. 删除Value=3的option: $("select#sel option[value='3']").remove(); //10.删除第几个option: $(" select#sel option ").eq(索引值).remove();//索引值=0,1,2…. //如删除第3个Radio: $(" select#sel option ").eq(2).remove(); //11.删除第一个option: $(" select#sel option ").eq(0).remove(); //或者 $("select#sel option:first").remove(); //12. 删除最后一个option: $("select#sel option:last").remove(); //13. 删除dropdownlist: $("select#sel").remove(); //14.在select后面添加一个option: $("select#sel").append("<option value='6'>f</option>"); //15. 在select前面添加一个option: $("select#sel").prepend("<option value='0'>0</option>"); //16. 遍历option: $(" select#sel option ").each(function (index, domEle) { //写入代码 });