الفرق بين المراجعتين لصفحة: «jQuery/blur»
Kinan-mawed (نقاش | مساهمات) لا ملخص تعديل |
لا ملخص تعديل |
||
| (5 مراجعات متوسطة بواسطة مستخدم واحد آخر غير معروضة) | |||
| سطر 1: | سطر 1: | ||
<noinclude>{{DISPLAYTITLE:التابع <code>.blur()</code> في jQuery}}</noinclude> | <noinclude>{{DISPLAYTITLE:التابع <code>.blur()</code> في jQuery}}</noinclude> | ||
== <code>.blur( handler )</code> == | == <code>.blur( handler )</code> == | ||
===القيمة المعادة=== | ===القيمة المعادة=== | ||
كائن [[ | كائن [[jQuery/jQuery|jQuery]]. | ||
===الوصف=== | ===الوصف=== | ||
يُستخدَم التابع <code>.blur()</code> في ربط مُعالِج أحداث (event handler) إلى حدث الضّبابيّة (blur) في JavaScript، أو إطلاق هذا الحدث على عنصر ما. | يُستخدَم التابع <code>.blur()</code> في ربط مُعالِج أحداث (event handler) إلى حدث الضّبابيّة (blur) في JavaScript، أو إطلاق هذا الحدث على عنصر ما. | ||
| سطر 29: | سطر 28: | ||
يُعدُّ هذا التّابع اختصارًا للتابع <code>.on( "blur", handler )</code> في أول شكلين له، وللتّابع <code>.trigger( "blur" )</code> في شكله الثّالث. | يُعدُّ هذا التّابع اختصارًا للتابع <code>.on( "blur", handler )</code> في أول شكلين له، وللتّابع <code>.trigger( "blur" )</code> في شكله الثّالث. | ||
يُرسَل الحدث <code>blur</code> إلى العنصر عندما يفقد التركيز عنه، وكان يُطبَّق أصلًا فقط على عناصر حقول الإدخال مثل <code>[[HTML/input|<input>]]</code>، ولكن في المتصفّحات الحديثة توسّع مجال هذا الحدث ليشمل كافّة أنواع العناصر، حيث يُمكِن للعنصر أن يفقد التركيز عنه عبر أوامر لوحة المفاتيح مثل زر | يُرسَل الحدث <code>blur</code> إلى العنصر عندما يفقد التركيز عنه، وكان يُطبَّق أصلًا فقط على عناصر حقول الإدخال مثل <code>[[HTML/input|<input>]]</code>، ولكن في المتصفّحات الحديثة توسّع مجال هذا الحدث ليشمل كافّة أنواع العناصر، حيث يُمكِن للعنصر أن يفقد التركيز عنه عبر أوامر لوحة المفاتيح مثل زر Tab أو عن طريق النقر على الفأرة في مكان آخر من الصفحة. | ||
لنأخذ مثال HTML التّالي:<syntaxhighlight lang="html"> | لنأخذ مثال HTML التّالي:<syntaxhighlight lang="html"> | ||
| سطر 40: | سطر 39: | ||
</div> | </div> | ||
<script> | |||
// يُمكِن ربط مُعالِج الحدث إلى أول حقل دخل | // يُمكِن ربط مُعالِج الحدث إلى أول حقل دخل | ||
$( "#target" ).blur(function() { | $( "#target" ).blur(function() { | ||
alert( "استُدعي مُعالِج الحدث للتابع .blur()" ); | alert( "استُدعي مُعالِج الحدث للتابع .blur()" ); | ||
}); | }); | ||
</syntaxhighlight>إن فقد الآن الحقل الأول التركيز عنه عن طريق الضغط في أي مكان آخر من الصفحة أو باستخدام زر <code>Tab</code>، فستُعرَض رسالة التنبيه التالية:<syntaxhighlight lang=" | </script> | ||
</syntaxhighlight>إن فقد الآن الحقل الأول التركيز عنه عن طريق الضغط في أي مكان آخر من الصفحة أو باستخدام زر <code>Tab</code>، فستُعرَض رسالة التنبيه التالية:<blockquote>استُدعي مُعالِج الحدث للتابع .blur()</blockquote>لإطلاق الحدث برمجيًّا، طبِّق التّابع <code>.blur()</code> بدون وسيط:<syntaxhighlight lang="javascript"> | |||
$( "#other" ).click(function() { | |||
$( "#target" ).blur(); | |||
}); | |||
</syntaxhighlight>بعد تنفيذ هذه الشيفرة سيُعطينا الضغط على عبارة "إطلاق مُعالِج الحدث" رسالة التنبيه. | |||
لا ينتقل (bubble) الحدث <code>blur</code> في متصفح Internet Explorer، لهذا لن تعمل الشيفرات التي تعتمد على تفويض الأحداث (event delegation) مع الحدث <code>blur</code> بشكل ثابت عبر المتصفحات. بدءًا من إصدار 1.4.2 تعمل jQuery على الالتفاف حول هذا التقييد عن طريق إعادة توجيه الحدث <code>blur</code> إلى الحدث <code>focusout</code> عن طريق توابع تفويض الأحداث <code>[[jQuery/live|.live()]]</code> و <code>[[jQuery/delegate|.delegate()]]</code>. | |||
=== ملاحظات إضافيّة === | |||
* لمّا كان التّابع <code>.blur()</code> مُجرَّد اختصار للتابع <code>.on( "blur", handler )</code>، فمن الممكن إلغاء الحدث عبر استخدام <code>.off( "blur" )</code>. | |||
=== أمثلة === | |||
لإطلاق الحدث <code>blur</code> على جميع الفقرات <code>[[HTML/p|<nowiki><p></nowiki>]]</code>:<syntaxhighlight lang="javascript"> | |||
$( "p" ).blur(); | |||
</syntaxhighlight> | </syntaxhighlight> | ||
==<span>مصادر</span>== | |||
*<span>[http://api.jquery.com/blur/ صفحة التابع .blur() في توثيق jQuery الرسمي].</span> | |||
[[تصنيف:jQuery]] | |||
[[تصنيف:jQuery Method]] | |||
[[تصنيف:jQuery Events]] | |||
المراجعة الحالية بتاريخ 08:12، 21 مايو 2018
.blur( handler )
القيمة المعادة
كائن jQuery.
الوصف
يُستخدَم التابع .blur() في ربط مُعالِج أحداث (event handler) إلى حدث الضّبابيّة (blur) في JavaScript، أو إطلاق هذا الحدث على عنصر ما.
.blur( handler )
أضيفت في الإصدار: 1.0.
handler
دالة على الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُطلَق فيها الحدث.
.blur( [eventData ], handler )
أضيفت في الإصدار: 1.4.3.
eventData
أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى إمكانيّة استخدام أي نوع)، ويُمثِّل كائن يحتوي على البيانات التي ستُمرَّر إلى مُعالِج الأحداث.
handler
دالة على الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُطلَق فيها الحدث.
.blur()
أضيفت في الإصدار: 1.0.
لا يقبل هذا الشكل من التّابع أيّة وسائط.
يُعدُّ هذا التّابع اختصارًا للتابع .on( "blur", handler ) في أول شكلين له، وللتّابع .trigger( "blur" ) في شكله الثّالث.
يُرسَل الحدث blur إلى العنصر عندما يفقد التركيز عنه، وكان يُطبَّق أصلًا فقط على عناصر حقول الإدخال مثل <input>، ولكن في المتصفّحات الحديثة توسّع مجال هذا الحدث ليشمل كافّة أنواع العناصر، حيث يُمكِن للعنصر أن يفقد التركيز عنه عبر أوامر لوحة المفاتيح مثل زر Tab أو عن طريق النقر على الفأرة في مكان آخر من الصفحة.
لنأخذ مثال HTML التّالي:
<form>
<input id="target" type="text" value="Field 1">
<input type="text" value="Field 2">
</form>
<div id="other">
إطلاق مُعالِج الحدث
</div>
<script>
// يُمكِن ربط مُعالِج الحدث إلى أول حقل دخل
$( "#target" ).blur(function() {
alert( "استُدعي مُعالِج الحدث للتابع .blur()" );
});
</script>
إن فقد الآن الحقل الأول التركيز عنه عن طريق الضغط في أي مكان آخر من الصفحة أو باستخدام زر Tab، فستُعرَض رسالة التنبيه التالية:
استُدعي مُعالِج الحدث للتابع .blur()
لإطلاق الحدث برمجيًّا، طبِّق التّابع .blur() بدون وسيط:
$( "#other" ).click(function() {
$( "#target" ).blur();
});
بعد تنفيذ هذه الشيفرة سيُعطينا الضغط على عبارة "إطلاق مُعالِج الحدث" رسالة التنبيه.
لا ينتقل (bubble) الحدث blur في متصفح Internet Explorer، لهذا لن تعمل الشيفرات التي تعتمد على تفويض الأحداث (event delegation) مع الحدث blur بشكل ثابت عبر المتصفحات. بدءًا من إصدار 1.4.2 تعمل jQuery على الالتفاف حول هذا التقييد عن طريق إعادة توجيه الحدث blur إلى الحدث focusout عن طريق توابع تفويض الأحداث .live() و .delegate().
ملاحظات إضافيّة
- لمّا كان التّابع
.blur() مُجرَّد اختصار للتابع.on( "blur", handler )، فمن الممكن إلغاء الحدث عبر استخدام .off( "blur" ).
أمثلة
لإطلاق الحدث blur على جميع الفقرات <p>:
$( "p" ).blur();