onfocusin 事件

CodeW3C Yariman Koyan

Yariman HTML
浏览器脚本
服务器脚本
Yariman Programming
Yariman XML
Kita Koyan Koyan
Kita Koyan

课程表

JS 参考手册

JS 参考手册（类别排序）
JS 参考手册（字母排序）

JavaScript

JS Array
JS Boolean
JS Class
JS Date
JS Error
JS Global
JS JSON
JS Map
JS Math
JS Number
JS Promise
JS RegExp
JS Set
JS String
JS 对象
JS 运算符
JS 运算符优先级
JS 语句
JS 类型化数组

Window

Obhaji Window
Window Console
Window History
Window Location
Window Navigator
Window Screen

HTML DOM

HTML Document
HTML Element
HTML Attribute
HTML Event
HTML Event 对象
HTML Collection
HTML NodeList
HTML DOMTokenList
HTML Style

Web API

API Canvas
API Console
API Fetch
API Fullscreen
API Geolocation
API History
API MediaQueryList
API Storage
API Validation
API Web

HTML ɗanar

<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>
<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>
</a></li> <li><a href="/ha/jsref/dom_obj_time.html" title="HTML DOM Time ɗanar"><time></a></li> <li><a href="/ha/jsref/dom_obj_title.html" title="HTML DOM Title ɗanar"><title></a></li> <li><a href="/ha/jsref/dom_obj_track.html" title="HTML DOM Track ɗanar"><track></a></li> <li><a href="/ha/jsref/dom_obj_u.html" title="HTML DOM Underline ɗanar"><u></a></li> <li><a href="/ha/jsref/dom_obj_ul.html" title="HTML DOM Ul ɗanar"><ul></a></li> <li><a href="/ha/jsref/dom_obj_var.html" title="HTML DOM Variable ɗanar"><var></a></li> <li><a href="/ha/jsref/dom_obj_video.html" title="HTML DOM Video ɗanar"><video></a></li> </ul> <h2>其他参考手册</h2> <ul> <li><a href="/ha/jsref/obj_cssstyledeclaration.html" title="CSSStyleDeclaration ɗanar">CSSStyleDeclaration</a></li> <li><a href="/ha/jsref/jsref_type_conversion.html" title="JavaScript ɗanar tsaɗaɗa">JS 类型转换</a></li> </ul> </div> <div><h3><center> 选修课 </center><h3> <h2>课程推荐：</h2> <ul> <li><a href="/ha/howto/index.html" title="CodeW3C.com ɗanar Bokar">CodeW3C.com ɗanar Bokar</a></li> </ul> </div> </div> <div id="maincontent"> <div class="idea"> <a href="/"><button>English</button></a> <a href="/zh/"><button>中文</button></a> <a href="/oldzh/"><button>繁體中文</button></a> <a href="/ru/"><button>Русский</button></a> <a href="/fr/"><button>Français</button></a> <a href="/de/"><button>Deutsch</button></a> <a href="/es/"><button>Español</button></a> <a href="/pt/"><button>Português</button></a> <a href="/ja/"><button>日本語</button></a> <a href="/ko/"><button>한국어</button></a> <a href="/it/"><button>Italiano</button></a> <a href="/ar/"><button>عربي</button></a> <a href="/hi/"><button>हिंदी</button></a> <a href="/bn/"><button>বাংলা</button></a> <a href="/ms/"><button>Bahasa Malaysia</button></a> <a href="/my/"><button>မြန်မာ</button></a> <a href="/vi/"><button>Tiếng Việt</button></a> <a href="/th/"><button>ภาษาไทย</button></a> <a href="/lo/"><button>ລາວ</button></a> <a href="/id/"><button>Bahasa Indonesia</button></a> <a href="/ur/"><button>اردو</button></a> <a href="/ha/"><button>Hausa</button></a> <a href="/pl/"><button>Język polski</button></a> <a href="/pa/"><button>ਪੰਜਾਬੀ</button></a> <a href="/sv/"><button>Svenska</button></a> <a href="/da/"><button>Dansk</button></a> <a href="/nl/"><button>Nederlands</button></a> <a href="/tr/"><button>Türkçe</button></a> <a href="/fi/"><button>suom.</button></a> <a href="/el/"><button>Ελληνικά</button></a> <a href="/fa/"><button>فارسی</button></a> <a href="/sw/"><button>Kiswahili</button></a> <a href="/te/"><button>తెలుగు</button></a> <a href="/tl/"><button>wikang Galu</button></a> </div> <h1>onfocusin 事件</h1> <div class="btn-toref"> <a href="/ha/jsref/dom_obj_event.html" title="Obhaji HTML DOM Event">DOM ɗanar fali</a> <a href="/ha/jsref/obj_focusevent.html" title="HTML DOM FocusEvent ɗanar">FocusEvent</a> </div> <div> <h2>定义和用法</h2> <p>onfocusin 事件在元素即将获得焦点时发生。</p> <p class="tip"><span>Koyarwa:</span>onfocusin 事件类似于 <a href="/ha/jsref/event_onfocus.html" title="onfocus ɗanar fali">onfocus ɗanar fali</a>。主要区别在于 onfocus 事件不会冒泡。因此，如果你想知道一个元素或其子元素是否获得焦点，你应该使用 onfocusin 事件。</p> <p class="tip"><span>Koyarwa:</span>Ba a kafa event onfocusin a Firefox kafa kafara, amma ka iya gani irin da element na yara ke kai fokusin ta amfani da event onfocusin capture listener (amfani da optional useCapture parameter a methodan addEventListener()). Kafara: event onfocus ko kafa kafara. Kafara: onfocusin event kafara:</p> <p class="tip"><span>Koyarwa:</span>Onfocusin event da <a href="/ha/jsref/event_onfocusout.html" title="onfocusout ɗanar fali">onfocusout ɗanar fali</a>Kafara:</p> </div> <div> <h2>Shirin</h2> <h3>Shirin 1</h3> <p>A kafa JavaScript a lokacin da input field ke kai fokusin:</p> <pre class="language-html"> <input type="text" onfocusin="myFunction()"> </pre> <p class="tiy"><a target="_blank" href="/ha/tiy/t.html?f=event_onfocusin">Kwamta ɗanar</a></p> <p>Rarrabawa TIY a kundin yanar gizo.</p> </div> <div> <h2>Karamin</h2> <p>A yin amfani da HTML:</p> <pre class="language-html"> <<i>element</i> onfocusin="<i>myScript</i>"> </pre> <p class="tiy"><a target="_blank" href="/ha/tiy/t.html?f=event_onfocusin_html">Kwamta ɗanar</a></p> <p>A yin amfani da JavaScript (a Chrome, Safari da Opera 15+ an iya kafa kafara):</p> <pre class="language-js"> <i>object</i>.onfocusin = function(){<i>myScript</i>}; </pre> <p class="tiy"><a target="_blank" href="/ha/tiy/t.html?f=event_onfocusin_dom">Kwamta ɗanar</a></p> <p>A yin amfani da methodan addEventListener() a JavaScript:</p> <pre class="language-js"> <i>object</i>.addEventListener("focusin", <i>myScript</i>); </pre> <p class="tiy"><a target="_blank" href="/ha/tiy/t.html?f=event_onfocusin_addeventlistener">Kwamta ɗanar</a></p> <p class="note"><span>注释：</span>Internet Explorer 8 da kafin ya kafa kafara: <a href="/ha/jsref/met_element_addeventlistener.html" title="HTML DOM addEventListener() ɗanar harsa">Methodan addEventListener()</a>.</p> </div> <div> <h2>Rarrabawa tekniki</h2> <table class="definition-usage"> <tr> <th>Kafara:</th> <td>支持</td> </tr> <tr> <th>Kafara:</th> <td>Kafara:</td> </tr> <tr> <th>Kafara:</th> <td><a href="/ha/jsref/obj_focusevent.html" title="HTML DOM FocusEvent ɗanar">FocusEvent</a></td> </tr> <tr> <th>Dubaɗi HTML dama:</th> <td>Dubaɗi HTML dama, kuma <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> da <title>.</td> </tr> <tr> <th style="width: 25%;">DOM 版本：</th> <td>Level 2 Events</td> </tr> </table> </div> <div> <h2>浏览器支持</h2> <p>表中的数字注明了完全支持该事件的首个浏览器版本。</p> <table class="browser-support"> <tr> <th class="bsTh">事件</th> <th class="bsChrome">Chrome</th> <th class="bsIE">IE</th> <th class="bsFirefox">Firefox</th> <th class="bsSafari">Safari</th> <th class="bsOpera">Opera</th> </tr> <tr> <td>onfocusin</td> <td>支持</td> <td>支持</td> <td>52.0</td> <td>支持</td> <td>支持</td> </tr> </table> <p class="note"><span>注释：</span>onfocusin 事件在使用 JavaScript HTML DOM 语法的 Chrome、Safari 和 Opera 15+ 中可能无法按预期工作。但是，它应该作为 HTML 属性并使用 addEventListener() 方法（请参见下面的语法示例）。</p> </div> <div> <h2>更多实例</h2> <h3>例子 2</h3> <p>将 "onfocusin" 与 "onfocusout" 事件一起使用：</p> <pre class="language-html"> <input type="text" onfocusin="focusFunction()" onfocusout="blurFunction()"> </pre> <p class="tiy"><a target="_blank" href="/ha/tiy/t.html?f=event_onfocusin_onfocusout">Kwamta ɗanar</a></p> <h3>例子 3</h3> <p>事件委托：将 addEventListener() 的 useCapture 参数设置为 true（用于 focus 和 blur）：</p> <pre class="language-html"> <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> </pre> <p class="tiy"><a target="_blank" href="/ha/tiy/t.html?f=event_onfocus_eventdelegation">Kwamta ɗanar</a></p> <h3>例子 4</h3> <p>事件委托：使用 focusin 事件：</p> <pre class="language-html"> <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> </pre> <p class="tiy"><a target="_blank" href="/ha/tiy/t.html?f=event_onfocusin_eventdelegation">Kwamta ɗanar</a></p> </div> <div class="btn-toref"> <a href="/ha/jsref/dom_obj_event.html" title="Obhaji HTML DOM Event">DOM ɗanar fali</a> <a href="/ha/jsref/obj_focusevent.html" title="HTML DOM FocusEvent ɗanar">FocusEvent</a> </div><div style="background-color:#fcfdf8; padding:0;"> </div> </div>  <div id="sidebar"> <div><h3><center> Kwamta </center><h3> <h5 id="tools_reference"><a href="/ha/jsref/index.html">Kita Koyan JavaScript da HTML DOM</a></h5> <h5 id="tools_example"><a href="/ha/js/js_examples.html">Kwararru JavaScript</a></h5> <h5 id="tools_quiz"><a href="/ha/js/js_quiz.html">Tsaɗaɗa JavaScript</a></h5> <h5 id="tools_tutorial"><a href="/ha/js/index.html">Tsaɗaɗa JavaScript</a></h5> </div> <div><h3><center> Rarrabuwar sarki </center><h3> <div id="sbtg"> <script src="/myjs/zzsr.js"></script> </div> </div> </div> <div id="footer"> <p id="p1"> CodeW3C.com ɗanar yanki gargaɗi waɗanda ke ɗanar yanki ɗanar, ɗanar ba ɗanar ɗanar. Risiko da ɗanar yanki ke ɗanar yanki kuma yanki yau ɗanar yanki. Dabbobi na yanki, yanki ɗanar hukunci. Dabbobi na hakimiyya, yanki ɗanar hakimiyya. </p> <p id="p2"> <a href="/ha/about/index.html" title="Hakkani CodeW3C.com">Hakkani CodeW3C.com</a> <a href="/ha/about/about_helping.html" title="Nuna CodeW3C.com">Nuna CodeW3C.com</a> <a href="/ha/about/about_use.html" title="Hakkani ɗanar">Tsaɗaɗa ɗanar</a> <a href="/ha/about/about_privacy.html" title="Hakkani ɗanar">Gajere ɗanar</a> <a href="http://www.comfortsoftwaregroup.com/" target="_blank"><img src="/comfortsoftwaregroup.png"></a> <a href="http://www.ce4e.com/" target="_blank"><img src="/poweredby.png" alt="Kan ayya Ce4e.com"></a> </p> </div> </div>  <script src="/myjs/tongji.js"></script> </body> </html>