أحدث البرامج التعليمية وتطوير الشبكة
 

حدث onfocusin

<كائن الحدث

مثال

تنفيذ جافا سكريبت عندما يكون حقل الإدخال على وشك الحصول على التركيز:

<input type="text" onfocusin="myFunction()">
انها محاولة لنفسك »

أكثر "Try it Yourself" الأمثلة أدناه.


تعريف والاستخدام

يحدث هذا الحدث onfocusin عندما عنصرا على وشك الحصول على التركيز.

نصيحة: الحدث onfocusin مشابه ل تشغيل OnFocus الحدث. والفرق الرئيسي هو أن الحدث تشغيل OnFocus لا فقاعة. لذلك، إذا كنت ترغب في معرفة ما إذا كان عنصر أو التابعة له يحصل على التركيز، ويجب استخدام الحدث onfocusin.

نصيحة: على الرغم من فايرفوكس لا يدعم الحدث onfocusin، يمكنك معرفة ما إذا كان الطفل عنصر يحصل على التركيز أو لا، وذلك باستخدام مستمع اسر ل تشغيل OnFocus الحدث (باستخدام المعلمة useCapture اختياري من addEventListener() طريقة).

Tip: الحدث onfocusin هو عكس onfocusout الحدث.


دعم المتصفح

هدف
onfocusin نعم فعلا نعم فعلا غير معتمد نعم فعلا نعم فعلا

ملاحظة: قد لا يعمل الحدث onfocusin كما هو متوقع في كروم وسفاري وأوبرا 15+ باستخدام بناء الجملة جافا سكريبت HTML DOM. ومع ذلك، يجب أن يعمل كسمة HTML وباستخدام addEventListener() الأسلوب.


بناء الجملة

في HTML:

في جافا سكريبت (may not work as expected in Chrome, Safari and Opera 15+) :

object .onfocusin=function(){ انها محاولة لنفسك »

في جافا سكريبت، وذلك باستخدام addEventListener() الأسلوب:

object .addEventListener("focusin", myScript );
انها محاولة لنفسك »

ملاحظة: addEventListener() لا يتم اعتماد طريقة في Internet Explorer 8 والإصدارات السابقة.


تفاصيل تقنية

فقاعات: نعم فعلا
للإلغاء: لا
نوع الحدث: FocusEvent
علامات HTML المعتمدة: ALL عناصر HTML، باستثناء: <قاعدة>، <BDO> و <br>، <head>، <HTML>، <IFRAME>، <meta>، <المعلمة>، <script>، <نمط>، و <title>
صفحة DOM: مستوى 2 الفعاليات

أمثلة

مزيد من الأمثلة

مثال

باستخدام "onfocusin" جنبا إلى جنب مع "onfocusout" الحدث:

<input type="text" onfocusin="focusFunction()" onfocusout="blurFunction()">
انها محاولة لنفسك »

مثال

وفد الحدث: تعيين المعلمة useCapture من addEventListener() إلى true (for focus and blur) :

<form id="myForm">
  <input type="text" id="myInput">
</form>

<script>
var x = document.getElementById("myForm");
x.addEventListener("focus", myFocusFunction, true );
x.addEventListener("blur", myBlurFunction, true );

function myFocusFunction() {
    document.getElementById("myInput").style.backgroundColor = "yellow";
}

function myBlurFunction() {
    document.getElementById("myInput").style.backgroundColor = "";
}
</script>
انها محاولة لنفسك »

مثال

وفد الحدث: استخدام الحدث focusin (غير معتمدة من قبل فايرفوكس):

<form id="myForm">
  <input type="text" id="myInput">
</form>

<script>
var x = document.getElementById("myForm");
x.addEventListener("focusin", myFocusFunction);
x.addEventListener("focusout", myBlurFunction);

function myFocusFunction() {
    document.getElementById("myInput").style.backgroundColor = "yellow";
}

function myBlurFunction() {
    document.getElementById("myInput").style.backgroundColor = "";
}
</script>
انها محاولة لنفسك »

<كائن الحدث