关于html中的onBlur事件和focus事件

最新推荐文章于 2024-06-29 11:18:05 发布

最新推荐文章于 2024-06-29 11:18:05 发布 · 636 阅读

收录于

当前文章被以下社区和专栏收录：

本文详细解释了HTML中的onBlur和onFocus事件的定义和用法，通过实例展示了如何在用户操作文本框时改变其外观，提供了一个交互性的网页设计技巧。

定义和用法

onblur 事件会在对象失去焦点时发生。

就是一个事件,在控件获得失去焦点时是触发,

比如有一个文本输入框<input type="text">,你想在用户点击它输入文本时,执行改变它的外观或者其它什么操作,就可以定义完成这个操作的处理程序,并<input type="text" onblur="SomeSub">

onFocus事件就是当光标落在文本框中时发生的事件。就是得到焦点的时候触发。

可以编如下例子

<HTML> 
<HEAD> 
<TITLE>使用onBlur事件处理程序</TITLE> 
</HEAD> 
<BODY BGCOLOR="lavender"> 
<FORM name="F1"> 
<INPUT TYPE=text NAME=text1 value="1111ONBLUR_green" ONBLUR="(document.bgColor='green')"> 
<INPUT TYPE=text NAME=text2 value="2222ONBLUR_black" ONBLUR="(document.bgColor='black')"> 
<INPUT TYPE=text NAME=text2 value="3333ONBLUR_yellow" ONBLUR="(document.bgColor='yellow')"> 
<br>
<p>
<INPUT TYPE=text NAME=text3 value="4444onfocus_blue" onfocus="(document.bgColor='blue')"> 
<INPUT TYPE=text NAME=text4 value="5555onfocus_red" onfocus="(document.bgColor='red')">
<INPUT TYPE=text NAME=text4 value="6666onfocus_orange" onfocus="(document.bgColor='orange')">
</FORM> 
</BODY> 
</HTML>