المحدد :submit
في jQuery
المحدد submit:
الوصف
يحدِّد جميع عناصر الإدخال ذات النوع "submit".
jQuery( ":submit" )
أضيف مع الإصدار 1.0.
يُستعمَل المحدِّد :submi
t عادةً مع العناصر <input>
أو <button>
. انتبه إلى أنَّ بعض المتصفحات تعامل العنصر <button>
على أنَّها من النوع "submit" ضمنيًّا بينما لا تفعل متصفحات أخرى ذلك (مثل المتصفح Internet Explorer). إن أردت التأكد من عمل الشيفرة عبر جميع المتصفحات، وضمان تحديد العناصر <button>
التي سترسل النموذج بشكل صحيح، فاستعمل الخاصِّيَّة type
دومًا وحدِّد قيمتها.
ملاحظات إضافية
لمَّا كان المحدِّد :submit
هو ملحق في مكتبة jQuery وليس جزءًا من مواصفة CSS، فإنَّ الاستعلامات التي تستعمل :submit
لا يمكنها الاستفادة من سرعة الأداء الذي يوفره تابع DOM الأصلي querySelectorAll()
. للحصول على أداء أفضل في المتصفحات الحديثة، استعمل input[type="submit"]
أو button[type="submit"]
.
أمثلة
إيجاد جميع عناصر الإرسال التي تعد عناصر سليلة (descendants) من العنصر <td>
:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>submit مثالٌ عن استعمال المحدد</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>
نوع العنصر
</th>
<th>
العنصر
</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();
});
// مطلقًا :submit أسهل للتعديل، ولا تتعلق هذه الشيفرة بالمحدد HTML شيفرة إضافية لجعل
$( "#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>