摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="前端課件/jQuery/jquery-3.3.1.min.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="前端課件/jQuery/jquery-3.3.1.min.js"></script> </head> <body> <script> //$(':enabled')所有被選中的input元素(可以使用的input元素) //$(':disabled')所有禁用的input元素(不可以使用的input元素) //$(':selected')所有被選取的input元素,針對(duì)select元素 //$(':checked')所有被選中input元素 $(document).ready(function(){ //$(':enabled').css('background','pink') //$(':disabled').css('background','red') //$(':selected').css('color','blue') $(':checked').parent().css('color','red') }) </script> <form> 輸入框1<input type="text" name=""><br> 輸入框2<input type="text" name=""><br> 輸入框3<input type="text" name="" disabled="disabled"><br> 輸入框4<input type="text" name=""><br> </form> <select> <option>魔蝎座</option> <option selected="selected">雙魚座</option> <option>射手座</option> <option>天蝎座</option> </select> <br> 愛好 <label><input type="checkbox" name="">看書</label> <label><input type="checkbox" name="" checked>游泳</label> <label><input type="checkbox" name="">游戲</label> </body> </html>
本節(jié)主要介紹了jQuery表單選擇器$(':enabled')、$(':disabled')、$(':selected')、$(':checked')的用法
,運(yùn)用了三個(gè)常見表單案例分別是form表單、select表單、多選框,以及介紹了disabled、selected、checked是可以簡(jiǎn)寫的,還有重溫了<label>標(biāo)簽的使用方法,<label>標(biāo)簽當(dāng)元素被點(diǎn)擊,元素前面的多選框會(huì)自動(dòng)被選中。
批改老師:韋小寶批改時(shí)間:2018-11-10 14:17:58
老師總結(jié):嗯!寫的很不錯(cuò)!總結(jié)的很不錯(cuò)!完美!繼續(xù)加油吧??!