الفرق بين المراجعتين ل"jQuery/file selector"
< jQuery
اذهب إلى التنقل
اذهب إلى البحث
Khaled-yassin (نقاش | مساهمات) (أنشأ الصفحة ب'<noinclude>{{DISPLAYTITLE:المحدد <code>:file()</code> في jQuery}}</noinclude> == المحد...') |
|||
| (مراجعتان متوسطتان بواسطة نفس المستخدم غير معروضتين) | |||
| سطر 1: | سطر 1: | ||
| − | <noinclude>{{DISPLAYTITLE:المحدد <code>:file | + | <noinclude>{{DISPLAYTITLE:المحدد <code>:file</code> في jQuery}}</noinclude> |
| − | |||
== المحدد <code>:file</code> == | == المحدد <code>:file</code> == | ||
=== الوصف === | === الوصف === | ||
| − | يحدد كل | + | يحدد كل حقول الإدخال من النوع file التي تسمح برفع الملفات. |
=== <code>jQuery( ":file" )</code> === | === <code>jQuery( ":file" )</code> === | ||
أُضيف مع الإصدار: [http://api.jquery.com/category/version/1.0 1.0]. | أُضيف مع الإصدار: [http://api.jquery.com/category/version/1.0 1.0]. | ||
| − | يعادل المحدد <code>:file</code> الصيغة <code>[type="file"]</code>. وكما هو الحال مع الأصناف | + | يعادل المحدد <code>:file</code> الصيغة <code>[type="file"]</code>. وكما هو الحال مع الأصناف الزائفة الأخرى (تلك التي تبدأ بنقطتين رأسيتين <code>:</code>)، فمن المستحسن أن تسبقها باسم وسم أو مُحدِّد آخر؛ خلاف ذلك، يستخدم المحدد العالمي (<code>*</code>) كمحدد ضمني. وبعبارة أخرى ، فإن <code>$( ":file" )</code> الصريح يساوي <code>$("*:file" )</code> ، لذا يُفضَّل استخدام <code>$( "input:file" )</code> بدلاً من ذلك. |
=== ملاحظات إضافية === | === ملاحظات إضافية === | ||
| − | لأن <code>:file</code> هو ملحق jQuery وليس جزءًا من مواصفات CSS، فلا يمكن استفادة الاستعلامات | + | لأن <code>:file</code> هو ملحق تابع لمكتبة jQuery وليس جزءًا من مواصفات CSS، فلا يمكن استفادة الاستعلامات التي تستخدم <code>:file</code> من تحسين الأداء الذي يوفره تابع DOM الأصلي <code>[[JavaScript/Document/querySelectorAll|querySelectorAll()]]</code>. للحصول على أداء أفضل في المتصفحات الحديثة، استخدم المُحدِّد <code>[type="file"]</code> بدلاً من ذلك. |
=== أمثلة === | === أمثلة === | ||
| − | العثور على | + | العثور على جميع حقول رفع الملفات (عناصر <code>[[HTML/input|<input>]]</code> التي لها القيمة <code>[[HTML/input/file|file]]</code> للخاصية <code>type</code>):<syntaxhighlight lang="html+cheetah"> |
<!doctype html> | <!doctype html> | ||
<html lang="en"> | <html lang="en"> | ||
| سطر 65: | سطر 64: | ||
== مصادر == | == مصادر == | ||
| − | * [http://api.jquery.com/file-selector/ صفحة المحدد :file() في توثيق jQuery الرسمي]. | + | * [http://api.jquery.com/file-selector/ صفحة المحدد :file() في توثيق jQuery الرسمي]. |
[[تصنيف:jQuery]] | [[تصنيف:jQuery]] | ||
| − | |||
[[تصنيف:jQuery Selectors]] | [[تصنيف:jQuery Selectors]] | ||
المراجعة الحالية بتاريخ 10:19، 17 مايو 2018
المحدد :file
الوصف
يحدد كل حقول الإدخال من النوع file التي تسمح برفع الملفات.
jQuery( ":file" )
أُضيف مع الإصدار: 1.0.
يعادل المحدد :file الصيغة [type="file"]. وكما هو الحال مع الأصناف الزائفة الأخرى (تلك التي تبدأ بنقطتين رأسيتين :)، فمن المستحسن أن تسبقها باسم وسم أو مُحدِّد آخر؛ خلاف ذلك، يستخدم المحدد العالمي (*) كمحدد ضمني. وبعبارة أخرى ، فإن $( ":file" ) الصريح يساوي $("*:file" ) ، لذا يُفضَّل استخدام $( "input:file" ) بدلاً من ذلك.
ملاحظات إضافية
لأن :file هو ملحق تابع لمكتبة jQuery وليس جزءًا من مواصفات CSS، فلا يمكن استفادة الاستعلامات التي تستخدم :file من تحسين الأداء الذي يوفره تابع DOM الأصلي querySelectorAll(). للحصول على أداء أفضل في المتصفحات الحديثة، استخدم المُحدِّد [type="file"] بدلاً من ذلك.
أمثلة
العثور على جميع حقول رفع الملفات (عناصر <input> التي لها القيمة file للخاصية type):
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>file demo</title>
<style>
textarea {
height: 45px;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<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>
<div></div>
<script>
var input = $( "input:file" ).css({
background: "yellow",
border: "3px red solid"
});
$( "div" )
.text( "For this type jQuery found " + input.length + "." )
.css( "color", "red" );
$( "form" ).submit(function( event ) {
event.preventDefault();
});
</script>
</body>
</html>