<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jquery表单选择器</title> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <script> $(document).ready(function(){ //1、$(:disabled) 匹配表单中不可用的元素 $(':disabled').css("background","red"); //2、$(':enabled') 匹配表单中的可用元素 // $(':enabled').css("background","yellow"); //3、$(':selected') 匹配表单中下拉框的选中元素 $(":selected").css("color","pink"); //4、$(':checked') 匹配表单中复选框的选中元素 $("input:checked").parent().css("color","green"); }) </script> </head> <body> <form action=""> 输入框1<input type="text"><br/> 输入框2<input type="text" disabled><br/> 输入框3<input type="text"><br/> 输入框4<input type="text"><br/> 星座: <select name="" id=""> <option value="">水瓶座</option> <option selected value="">狮子座</option> <option value="">双鱼座</option> <option value="">摩羯座</option> </select> <label><input type="checkbox" checked name="keepreal" id="">呵呵</label> <label><input type="checkbox" name="keepreal" id="">嘻嘻</label> <label><input type="checkbox" name="keepreal" id="">好好</label> </form> </body> </html>
点击 "运行实例" 按钮查看在线实例