الفرق بين المراجعتين ل"jQuery/focusin"

من موسوعة حسوب
اذهب إلى التنقل اذهب إلى البحث
 
سطر 6: سطر 6:
  
 
=== الوصف ===
 
=== الوصف ===
يربط هذا التابع دالة معالج الحدث بحدث "focusin " من JavaScript.
+
يربط هذا التابع دالة معالج الحدث بحدث <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>.
سطر 38: سطر 38:
  
 
=== أمثلة ===
 
=== أمثلة ===
مراقبة التركيز حين يحدث داخل الفقرات في الصفحة.<syntaxhighlight lang="html">
+
مراقبة التركيز حين يحدث داخل الفقرات <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>

مصادر