(1) input，標籤選擇器，只選擇input元素;
(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>找出所有的input元素，以下這些元素都會被配對到。
HTML 程式碼:
<form>
<input type="button" value="Input Button"/>
<input type="checkbox" />
<input type="file" />
<input type="hidden" />
<input type="image" />
<input type="password" />
<input type="radio" />
<input type="reset" />
<input type="submit" />
<input type="text" />
<select><option>Option</option></select>
<textarea></textarea>
<button>Button</button>
</form>jQuery 程式碼:
$(":input")結果:
[
<input type="button" value="Input Button"/>,
<input type="checkbox" />,
<input type="file" />,
<input type="hidden" />,
<input type="image" />,
<input type="password" />,
<input type="radio" />,
<input type="reset" />,
<input type="submit" />,
<input type="text" />,
<select><option>Option</option></select>,
<textarea></textarea>,
<button>Button</button>,
]2. input僅選擇input元素。
找一個 input 元素。
HTML 程式碼:
<input>INPUT1</input> <input>INPUT2</input> <span>SPAN</span>
jQuery 程式碼:
$("input");結果:
[ <input>INPUT1</input>,<input>INPUT2</input> ]
以上是jQuery選擇器input和:input兩者之間的區別的詳細內容。更多資訊請關注PHP中文網其他相關文章！
