1. 程式人生 > >jQuery中input和:input選擇器的區別

jQuery中input和:input選擇器的區別

(1) input,標籤選擇器,僅僅選擇input元素<input type="text">
(2) :input,偽類選擇器,選擇表單中的input ,select, textarea, button元素.
示例如下:
html:

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
        <script>
            $(function
(){
$('input').css('border','1px solid red');//只有input標籤邊框變為紅色 $(':input').foucs(function(){//input select textarea button獲取焦點背景變為#fcc $(this).css('background','#fcc'); }).blur(function(){//失去焦點背景變為#fff $(this).css('background'
,'#fff'); }); })
</script> </head> <body> <form> <fieldset> <legend>個人基本資訊</legend> <div> <label for="username">名稱:</label> <input
type="text" id="username">
</div> <div> <label for="nation">國家:</label> <select> <option>中國</option> <option>美國</option> <option>英國</option> </select> </div> <div> <label for="msg">詳細資訊:</label> <textarea id="msg"></textarea> </div> <div> <button id="submit">提交</button> </div> </fieldset> </form> </body> </html>