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

حدث onfocusout

<كائن الحدث

مثال

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

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

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

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

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

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

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

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

دعم المتصفح

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

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

بناء الجملة

في HTML:

< انها محاولة لنفسك »

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

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

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

object .addEventListener("focusout", 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>
انها محاولة لنفسك »
<كائن الحدث