1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>第2章示例9</title> 6 <style type="text/css"> 7 body { width:760px; } 8 label,textarea,select { display:block; } 9 textarea { width:560px; } 10 div button { font:bold 16px/1 Arial,Helvetica,sans-serif; margin:1px 3px; padding:2px 0; cursor:pointer; width:165px; } 11 </style> 12 <script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script> 13 <script type="text/javascript"> 14 $(document).ready(function(){ 15 $("#btn1").click(function(){alert("可用的option元素有:"+$("option:enabled").length+"个");}); 16 $("#btn2").click(function(){alert("不可用的option元素有:"+$("option:disabled").length+"个");}); 17 $("#btn3").click(function(){alert("被选中的input元素有:"+$("input:checked").length+"个");}); 18 $("#btn4").click(function(){alert("被选中的option元素有:"+$(":selected").length+"个");}); 19 }); 20 </script> 21 </head> 22 <body> 23 <form id="test"> 24 <form id="test"><br/> 25 <input type="hidden"/> 26 <label><input type="text"/><input type="text"/></label> 27 <label><input type="password"/><input type="password"/></label> 28 <label><input type="file"/><input type="file"/></label> 29 <label><input type="image"/><input type="image"/></label> 30 <label><input type="radio" value="radio1" checked="checked"/><input type="radio" value="radio1" checked="checked"/></label> 31 <label><input type="radio" value="radio2"/><input type="radio" value="radio2"/></label> 32 <label><input type="radio" value="radio3"/><input type="radio" value="radio3"/></label> 33 <label><input type="radio" value="radio4" disabled="disabled"/><input type="radio" value="radio4" disabled="disabled"/></label> 34 <label><input type="checkbox" value="checkbox1" checked="checked"/><input type="checkbox" value="checkbox1" checked="checked"/></label> 35 <label><input type="checkbox" value="checkbox2" checked="checked"/><input type="checkbox" value="checkbox2" checked="checked"/></label> 36 <label><input type="checkbox" value="checkbox3"/><input type="checkbox" value="checkbox3"/></label> 37 <label><input type="checkbox" value="checkbox4" disabled="disabled"/><input type="checkbox" value="checkbox4" disabled="disabled"/></label> 38 <textarea disabled="disabled"><textarea disabled="disabled"></textarea></textarea> 39 <select><br/> 40 <select> 41 <option value="option1" selected="selected"><option value="option1" selected="selected"></option></option> 42 <option value="option2"><option value="option2" selected="selected"></option></option> 43 <option value="option3"><option value="option3" selected="selected"></option></option> 44 <option value="option4" disabled="disabled"><option value="option4" selected="selected"></option></option> 45 </select> 46 </select> <br/> 47 <select multiple="multiple"><br/> 48 <select multiple="multiple"> 49 <option value="option1" selected="selected"><option value="option1" selected="selected"></option></option> 50 <option value="option2" selected="selected"><option value="option2" selected="selected"></option></option> 51 <option value="option3"><option value="option3" selected="selected"></option></option> 52 <option value="option4" disabled="disabled"><option value="option4" selected="selected"></option></option> 53 </select> 54 </select> <br/> 55 <input type="button" value="<input type="button" value="**"/>"/><br /> 56 <input type="reset" value="<input type="reset" value="**"/>"/><br /> 57 <input type="submit" disabled="disabled" value="<input type="submit" value="**" disabled="disabled"/>"/><br /> 58 <button type="button"><button type="button"></button></button><br /> 59 <button type="reset"><button type="reset"></button></button><br /> 60 <button type="submit" disabled="disabled"><button type="submit" disabled="disabled"></button></button><br/> 61 </form> 62 </form> 63 <div> 64 <button type="button" id="btn1">$("option:enabled")</button> 65 <button type="button" id="btn2">$("option:disabled")</button> 66 <button type="button" id="btn3">$("input:checked")</button> 67 <button type="button" id="btn4">$(":selected")</button> 68 </div> 69 </body> 70 </html>