jquery 常见选择器详解3
1.常用的表单选择器
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="jquery-3.1.1.min.js"></script> <script type="text/javascript"> $(function(){ //alert($(":input").length); // alert($(":text").length); // alert($(":password").length); // alert($(":radio").val()); // alert($(":checkbox").val()); // alert($(":submit").val()); //alert($(":reset").val()); // alert($(":image").length); // alert($(":button").length); alert($(":file").length); }); </script> </head> <body> <form name="myform"> <input type="button" value="Input Button"/><br/> <input type="checkbox" value="football"/><br/> <input type="file" name="upload"/><br/> <input type="hidden" value="ok"/><br/> <input type="image" src="jia.jpg" width="50px" height="50px"/><br/> <input type="password" name="password" value="111"/><br/> <input type="radio" value="male">male<br/> <input type="reset" value="重置"><br/> <input type="submit" value="提交"><br/> <input type="text" name="name" value="haige"/><br/> <input type="text" name="age" value="age"><br/> <select> <option>Option1</option> <option>Option2</option> </select><br/> <textarea cols="10" rows="5">多行文本框</textarea> <button type="button">Button</button><br/> <input type="image" src="jia.jpg" width="50px" height="50px"/><br/> <img src="jia.jpg" width="50px" height="50px"/> </form> </body> </html>
运行截图:


2.表单对象属性过滤选择器
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="jquery-3.1.1.min.js"></script> <script type="text/javascript"> $(function(){ //alert($(':text:disabled').length); //alert($(':text:enabled').length); //alert($(':input:checked').length); alert($('select :selected').text());//查找select元素内部被选中的元素 //alert($('select:selected').text());//查找select元素内部被选中的下拉列表 }); </script> </head> <body> <form id="myform"> <input type="text" name="myname" value="haige"/><br/> <input type="text" name="myage" value="14" disabled="disabled"/><br/> <input type="text" name="pass" value="123"/><br/> <input type="text" name="dog" value="阿旺" disabled="disabled"/><br/> <input type="text" name="hobby" value="football" checked="checked"/>足球<br/> <input type="text" name="hobby" value="basketball"/>篮球<br/> <input type="text" name="hobby" value="tennis"/>网球<br/> <select name="test" multiple="multiple"> <option selected="selected">浙江</option> <option>湖南</option> <option>北京</option> <option>天津</option> <option selected="selected">上海</option> </select> </form> </body> </html>
运行截图:



浙公网安备 33010602011771号