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

تشغيل OnFocus الحدث

<كائن الحدث

مثال

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

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

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


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

يحدث هذا الحدث تشغيل OnFocus عندما يحصل عنصر التركيز.

غالبا ما يتم استخدام هذا الحدث تشغيل OnFocus مع <الإدخال>، <اختر <، و <a> .

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

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


دعم المتصفح

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

بناء الجملة

في HTML:

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

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

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

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

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


تفاصيل تقنية

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

أمثلة

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

مثال

عن طريق "onfocus" جنبا إلى جنب مع "onblur" الحدث:

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

<كائن الحدث