:submit 选择器
分类：选择器 > 表单选择器 | 选择器 > jQuery扩展选择器
submit selector
描述：选择所有的type="submit"的<input>元素和<button>元素。
加入于: 1.0
jQuery( ":submit" ):submit选择器应用到按钮或者输入元素上。注意，有些浏览器会把<button>元素潜在地视为type="submit"，与此同时，另一些浏览器（比如说Internet Explorer）不会这样。要想确保标记作用得跨浏览器一致，并保证可以一致地选择按钮以提交表单，请总是在按钮上指定type属性。
其它说明
- 因为
:submit是一个jQuery扩展，并不是CSS规范文档的一部分，使用:submit查询，不能充分利用原生DOM的querySelectorAll()方法来提高性能。要想在现代浏览器中获得更好的性能，请使用input[type="submit"], button[type="submit"]来代替它。
示例
找到所有提交元素，它们是一个td元素的后代元素。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>submit demo</title>
<style>
textarea {
height: 45px;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<form>
<table id="exampleTable" border="1" cellpadding="10" align="center">
<tr>
<th>
Element Type
</th>
<th>
Element
</th>
</tr>
<tr>
<td>
<input type="button" value="Input Button">
</td>
</tr>
<tr>
<td>
<input type="checkbox">
</td>
</tr>
<tr>
<td>
<input type="file">
</td>
</tr>
<tr>
<td>
<input type="hidden">
</td>
</tr>
<tr>
<td>
<input type="image">
</td>
</tr>
<tr>
<td>
<input type="password">
</td>
</tr>
<tr>
<td>
<input type="radio">
</td>
</tr>
<tr>
<td>
<input type="reset">
</td>
</tr>
<tr>
<td>
<input type="submit">
</td>
</tr>
<tr>
<td>
<input type="text">
</td>
</tr>
<tr>
<td>
<select><option>Option</option></select>
</td>
</tr>
<tr>
<td>
<textarea></textarea>
</td>
</tr>
<tr>
<td>
<button>Button</button>
</td>
</tr>
<tr>
<td>
<button type="submit">Button type="submit"</button>
</td>
</tr>
</table>
</form>
<div id="result"></div>
<script>
var submitEl = $( "td :submit" )
.parent( "td" )
.css({
background: "yellow",
border: "3px red solid"
})
.end();
$( "#result" ).text( "jQuery matched " + submitEl.length + " elements." );
// 防止表单提交
$( "form" ).submit(function( event ) {
event.preventDefault();
});
// 额外的JS使HTML更易于编辑(None of this is relevant to the ':submit' selector)
$( "#exampleTable" ).find( "td" ).each(function( i, el ) {
var inputEl = $( el ).children(),
inputType = inputEl.attr( "type" ) ? " type='" + inputEl.attr( "type" ) + "'" : "" ;
$( el ).before( "<td>" + inputEl[ 0 ].nodeName + inputType + "</td>" );
})
</script>
</body>
</html>
演示结果