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

حدث و onblur

<كائن الحدث

مثال

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

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

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


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

يحدث هذا الحدث و onblur عندما يفقد كائن التركيز.

غالبا ما يتم استخدام هذا الحدث و onblur مع رمز التحقق من صحة النموذج (على سبيل المثال عندما يترك المستخدم حقل نموذج).

Tip: الحدث و onblur هو على العكس من تشغيل OnFocus الحدث.

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


دعم المتصفح

هدف
onblur نعم فعلا نعم فعلا نعم فعلا نعم فعلا نعم فعلا

بناء الجملة

في HTML:

في جافا سكريبت:

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

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

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

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


تفاصيل تقنية

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

أمثلة

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

مثال

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

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

مثال

وفد الحدث: تعيين المعلمة useCapture من addEventListener() إلى صحيحا:

<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>
انها محاولة لنفسك »

<كائن الحدث