الفرق بين المراجعتين لصفحة: «jQuery/focusin»
Khaled-yassin (نقاش | مساهمات) ط ←الوصف |
لا ملخص تعديل |
||
| (مراجعة متوسطة واحدة بواسطة مستخدم واحد آخر غير معروضة) | |||
| سطر 6: | سطر 6: | ||
=== الوصف === | === الوصف === | ||
يربط هذا التابع دالة معالج الحدث بحدث " | يربط هذا التابع دالة معالج الحدث بحدث <code>"focusin"</code> من JavaScript. | ||
=== <code>.focusin( handler )</code> === | === <code>.focusin( handler )</code> === | ||
| سطر 12: | سطر 12: | ||
==== <code>handler</code> ==== | ==== <code>handler</code> ==== | ||
دالة على الشكل Function( Event eventObject ) | دالة على الشكل <code>[[JavaScript/Function|Function]]( [[JavaScript/Event|Event]] eventObject )</code>، وتُنفَّذ في كل مرة يُطلَق فيها الحدث. | ||
=== <code>.focusin( [eventData ], handler )</code> === | === <code>.focusin( [eventData ], handler )</code> === | ||
| سطر 21: | سطر 21: | ||
==== <code>handler</code> ==== | ==== <code>handler</code> ==== | ||
دالة على الشكل Function( Event eventObject ) | دالة على الشكل <code>[[JavaScript/Function|Function]]( [[JavaScript/Event|Event]] eventObject )</code>، وتُنفَّذ في كل مرة يُطلَق فيها الحدث. | ||
=== <code>.focusin()</code> === | === <code>.focusin()</code> === | ||
| سطر 30: | سطر 30: | ||
يُعد هذا التابع اختصارًا للتابع <code>[[jQuery/on|.on( "focusin", handler )]]</code> في صورته الأولى والثانية، والتابع <code>[[jQuery/trigger|.trigger( "focusin" )]]</code> في صورته الثالثة. | يُعد هذا التابع اختصارًا للتابع <code>[[jQuery/on|.on( "focusin", handler )]]</code> في صورته الأولى والثانية، والتابع <code>[[jQuery/trigger|.trigger( "focusin" )]]</code> في صورته الثالثة. | ||
يُرسَل الحدث <code>focusin</code> إلى عنصرٍ ما عندما يكون هو، أو أي عنصر داخله، ينال التركيز. ويختلف هذا عن الحدث <code>[[jQuery/focus|focus]]</code> في أنه يدعم الكشف عن حدث التركيز على العناصر | يُرسَل الحدث <code>focusin</code> إلى عنصرٍ ما عندما يكون هو، أو أي عنصر داخله، ينال التركيز. ويختلف هذا عن الحدث <code>[[jQuery/focus|focus]]</code> في أنه يدعم الكشف عن حدث التركيز على العناصر الأب (وبعبارة أخرى، فإنه يدعم انتقال الأحداث [event bubbling]). | ||
من الممكن استخدام هذا الحدث مع حدث <code>[[jQuery/focusout|focusout]]</code>. | من الممكن استخدام هذا الحدث مع حدث <code>[[jQuery/focusout|focusout]]</code>. | ||
=== ملاحظات إضافية === | === ملاحظات إضافية === | ||
لما كان التابع <code>.focusin()</code> هو مجرد اختصار للتابع <code>[[jQuery/on|.on( "focusin", handler )]]</code>، فإن فك الارتباط ممكن باستخدام <code>[[jQuery/off|.off( "focusin" )]]</code>. | |||
=== أمثلة === | === أمثلة === | ||
مراقبة التركيز حين يحدث داخل الفقرات في الصفحة | مراقبة التركيز حين يحدث داخل الفقرات <code>[[HTML/p|<nowiki><p></nowiki>]]</code> في الصفحة:<syntaxhighlight lang="html"> | ||
<!doctype html> | <!doctype html> | ||
<html lang="en"> | <html lang="en"> | ||
المراجعة الحالية بتاريخ 11:08، 29 مايو 2018
.focusin( handler )
القيمة المعادة
يُعيد كائنًا من النوع jQuery.
الوصف
يربط هذا التابع دالة معالج الحدث بحدث "focusin" من JavaScript.
.focusin( handler )
أُضيف مع الإصدار: 1.4.
handler
دالة على الشكل Function( Event eventObject )، وتُنفَّذ في كل مرة يُطلَق فيها الحدث.
.focusin( [eventData ], handler )
أُضيف مع الإصدار: 1.4.3.
eventData
كائن يحتوي على البيانات التي ستُمرر إلى معالج الحدث، ويمكن أن يكون من أي نوع من أنواع JavaScript.
handler
دالة على الشكل Function( Event eventObject )، وتُنفَّذ في كل مرة يُطلَق فيها الحدث.
.focusin()
أُضيف مع الإصدار: 1.0.
لا يقبل هذا الشكل أي وسائط.
يُعد هذا التابع اختصارًا للتابع .on( "focusin", handler ) في صورته الأولى والثانية، والتابع .trigger( "focusin" ) في صورته الثالثة.
يُرسَل الحدث focusin إلى عنصرٍ ما عندما يكون هو، أو أي عنصر داخله، ينال التركيز. ويختلف هذا عن الحدث focus في أنه يدعم الكشف عن حدث التركيز على العناصر الأب (وبعبارة أخرى، فإنه يدعم انتقال الأحداث [event bubbling]).
من الممكن استخدام هذا الحدث مع حدث focusout.
ملاحظات إضافية
لما كان التابع .focusin() هو مجرد اختصار للتابع .on( "focusin", handler )، فإن فك الارتباط ممكن باستخدام .off( "focusin" ).
أمثلة
مراقبة التركيز حين يحدث داخل الفقرات <p> في الصفحة:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>focusin demo</title>
<style>
span {
display: none;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p><input type="text"> <span>focusin fire</span></p>
<p><input type="password"> <span>focusin fire</span></p>
<script>
$( "p" ).focusin(function() {
$( this ).find( "span" ).css( "display", "inline" ).fadeOut( 1000 );
});
</script>
</body>
</html>