ล่าสุดการพัฒนาเว็บบทเรียน
×

JavaScript การอ้างอิง

ภาพรวม

JavaScript

JS เชือก JS จำนวน JS ผู้ประกอบการ JS งบ JS คณิตศาสตร์ JS วันที่ JS แถว JS บูลีน JS นิพจน์ทั่วไป JS สถานการณ์โดยรวม JS การแปลง

เบราว์เซอร์ BOM

Window Navigator Screen History Location

HTML DOM

DOM เอกสาร DOM องค์ประกอบ DOM แอตทริบิวต์ DOM เหตุการณ์ DOM รูปแบบ

HTML วัตถุ

<a> <abbr> <address> <area> <article> <aside> <audio> <b> <base> <bdo> <blockquote> <body> <br> <button> <canvas> <caption> <cite> <code> <col> <colgroup> <datalist> <dd> <del> <details> <dfn> <dialog> <div> <dl> <dt> <em> <embed> <fieldset> <figcaption> <figure> <footer> <form> <head> <header> <h1> - <h6> <hr> <html> <i> <iframe> <img> <ins> <input> button <input> checkbox <input> color <input> date <input> datetime <input> datetime-local <input> email <input> file <input> hidden <input> image <input> month <input> number <input> password <input> radio <input> range <input> reset <input> search <input> submit <input> text <input> time <input> url <input> week <kbd> <keygen> <label> <legend> <li> <link> <map> <mark> <menu> <menuitem> <meta> <meter> <nav> <object> <ol> <optgroup> <option> <output> <p> <param> <pre> <progress> <q> <s> <samp> <script> <section> <select> <small> <source> <span> <strong> <style> <sub> <summary> <sup> <table> <td> <th> <tr> <textarea> <time> <title> <track> <u> <ul> <var> <video>

วัตถุอื่น ๆ

CSSStyleDeclaration


 

เหตุการณ์ onfocusin

<object เหตุการณ์

ตัวอย่าง

รัน JavaScript เมื่อช่องใส่เป็นเรื่องเกี่ยวกับที่จะได้รับโฟกัส:

<input type="text" onfocusin="myFunction()">
ลองตัวเอง»

เพิ่มเติม "Try it Yourself" ตัวอย่างด้านล่าง


ความหมายและการใช้งาน

เหตุการณ์ที่เกิดขึ้นเมื่อ onfocusin องค์ประกอบเป็นเรื่องเกี่ยวกับที่จะได้รับการมุ่งเน้น

เคล็ดลับ: เหตุการณ์ onfocusin คล้ายกับ onfocus เหตุการณ์ ความแตกต่างที่สำคัญคือเหตุการณ์ onfocus ไม่ฟอง ดังนั้นถ้าคุณต้องการที่จะหาว่าองค์ประกอบหรือบุตรหลานของตนได้รับการมุ่งเน้นที่คุณควรใช้เหตุการณ์ onfocusin

เคล็ดลับ: แม้ว่า Firefox ไม่สนับสนุนเหตุการณ์ onfocusin คุณสามารถหาว่าเป็นเด็กขององค์ประกอบโดนโฟกัสหรือไม่โดยใช้เป็นผู้ฟังที่จับสำหรับ onfocus เหตุการณ์ (โดยใช้พารามิเตอร์ useCapture เสริมของ addEventListener() วิธีการ)

Tip: เหตุการณ์ onfocusin อยู่ฝั่งตรงข้ามของ onfocusout เหตุการณ์


สนับสนุนเบราว์เซอร์

เหตุการณ์
onfocusin ใช่ ใช่ ได้รับการสนับสนุน ใช่ ใช่

หมายเหตุ: เหตุการณ์ onfocusin อาจไม่ทำงานตามที่คาดไว้ใน Chrome, Safari และ Opera 15+ โดยใช้ไวยากรณ์ JavaScript HTML DOM แต่ก็ควรจะทำงานเป็นแอตทริบิวต์ HTML และโดยใช้ addEventListener() วิธีการ


วากยสัมพันธ์

ใน HTML:

ใน JavaScript (may not work as expected in Chrome, Safari and Opera 15+) :

object .onfocusin=function(){ ลองตัวเอง»

ใน JavaScript โดยใช้ addEventListener() วิธีการ:

object .addEventListener("focusin", myScript );
ลองตัวเอง»

หมายเหตุ: addEventListener() วิธีการที่ไม่ได้รับการสนับสนุนใน Internet Explorer 8 และรุ่นก่อนหน้านี้


รายละเอียดทางเทคนิค

บับเบิ้ล: ใช่
ยกเลิก: ไม่
ประเภทเหตุการณ์: FocusEvent
แท็ก HTML ที่รองรับ: องค์ประกอบ HTML ทั้งหมดยกเว้น: <ฐาน> <BDO> ฟรี <head> <html> <iframe> <meta> <พารามิเตอร์> <script> <style> และ <title>
DOM เวอร์ชัน: ระดับที่ 2 เหตุการณ์

ตัวอย่าง

ตัวอย่างอื่น ๆ

ตัวอย่าง

ใช้ "onfocusin" ร่วมกับ "onfocusout" เหตุการณ์:

<input type="text" onfocusin="focusFunction()" onfocusout="blurFunction()">
ลองตัวเอง»

ตัวอย่าง

คณะผู้แทนของเหตุการณ์: การตั้งค่าพารามิเตอร์ของ useCapture addEventListener() จริง (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 (ไม่ใช่การสนับสนุนโดย Firefox):

<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>
ลองตัวเอง»

<object เหตุการณ์