获得焦点与失去焦点事件

淩亂°似流年 2022-05-12 00:00 252阅读 0赞

**一 介绍**

获得焦点事件（onfocus）是当某个元素获得焦点时触发事件处理程序。

失去焦点事件（onblur）是当前元素失去焦点时触发事件处理程序。

一般情况下，这两个事件是同时使用的。

**二 应用**

文本框获得焦点时改变背景颜色

本示例是在用户选择页面中的文本框时，改变文本框的背景颜色，当选择其他文本框时，将失去焦点的文本框背景颜色恢复原始状态。

**三 代码**

<table align="center" width="337" height="204" border="0">
     <tr>
     <td width="108">用户名:</td>
     <td width="213"><form name="form1" method="post" action="">
     <input type="text" name="textfield" οnfοcus="txtfocus()" onBlur="txtblur()">
     </form></td>
     </tr>
     <tr>
     <td>密码:</td>
     <td><form name="form2" method="post" action="">
     <input type="text" name="textfield2" οnfοcus="txtfocus()" onBlur="txtblur()">
     </form></td>
     </tr>
     <tr>
     <td>真实姓名:</td>
     <td><form name="form3" method="post" action="">
     <input type="text" name="textfield3" οnfοcus="txtfocus()" onBlur="txtblur()">
     </form></td>
     </tr>
     <tr>
     <td>性别:</td>
     <td><form name="form4" method="post" action="">
     <input type="text" name="textfield5" οnfοcus="txtfocus()" onBlur="txtblur()">
     </form></td>
     </tr>
     <tr>
     <td>邮箱:</td>
     <td><form name="form5" method="post" action="">
     <input type="text" name="textfield4" οnfοcus="txtfocus()" onBlur="txtblur()">
     </form></td>
     </tr>
    </table>
    <script language="javascript">
    
    </script>

**四 运行结果**

![03ebe78e-b22b-3ef3-a46b-c0fe0aaec203.png][]

[03ebe78e-b22b-3ef3-a46b-c0fe0aaec203.png]: /images/20220512/f190b706ed044cd696bfc92e3ca8414f.png

发表评论取消回复

表情：

评论列表（有 0 条评论，252人围观）

还没有评论，来说两句吧...

相关阅读

相关 android 使布局失去焦点,关于edittext的焦点问题(监听事件/默认没有焦点/获得焦点/失去焦点 )...

1.当edittext的焦点事件改变时,可以通过焦点监听事件来监听焦点改变事件 mEditText.setOnFocusChangeListener(new View.OnF

一时失言乱红尘/ 2022年10月17日 13:58/ 0 赞/ 312 阅读

相关 html 页面失去焦点事件,详解HTML onfocus获得焦点和onblur失去焦点事件

HTML onfocus 事件属性定义和用法 onfocus 属性在元素获得焦点时触发。 onfocus 常用于、以及 . 提示：onfocus 属性与 onbl

偏执的太偏执、/ 2022年10月06日 07:57/ 0 赞/ 245 阅读

相关 html5 获得窗口焦点和失去窗口焦点

> 当前窗口获得焦点js事件，html5发布之前我们使用window.onfocus和window.onblur来获得窗口焦点和失去窗口焦点，监听 onfocus()

ゝ一世哀愁。/ 2022年09月05日 06:10/ 0 赞/ 464 阅读

相关 Qt获得焦点和失去焦点处理事件（Focus事件）

方法一：描述：一开始我要实现的目的就是，在一个窗体上有多个可编辑控件（比如QLineEdit、QTextEdit等），当哪个控件获得焦点，哪个控件的背景就高亮用来起提示作用

布满荆棘的人生/ 2022年06月08日 09:11/ 0 赞/ 1021 阅读

相关失去焦点修改事件

一介绍失去焦点修改事件（onchange）是当前元素失去焦点并且元素的内容发生改变时触发事件处理程序。该事件一般在下拉文本框中使用。二应用用下拉文本框改变

红太狼/ 2022年05月12日 00:00/ 0 赞/ 374 阅读

相关获得焦点与失去焦点事件

一介绍获得焦点事件（onfocus）是当某个元素获得焦点时触发事件处理程序。失去焦点事件（onblur）是当前元素失去焦点时触发事件处理程序。一般情况下，这两个事

淩亂°似流年/ 2022年05月12日 00:00/ 0 赞/ 253 阅读

相关 onfocus获取焦点事件与onblur失去焦点事件

<input type="text" value="请输入您的称呼" "if (value =='请输入您的称呼'){value =''}" "if (value ==

蔚落/ 2022年04月24日 07:26/ 0 赞/ 373 阅读

相关 Qt获得和失去焦点事件(Focus事件)

1.重写控件的focusInEvent()和focusOutEvent()函数针对一个窗口上的多个可编辑控件(比如QLineEdit、QTextEdit等)，我们希望控

痛定思痛。/ 2022年04月15日 05:20/ 0 赞/ 1949 阅读

相关 javascript中获得焦点onfocus与失去焦点onblur

javascript中获得焦点onfocus与失去焦点onblur 2010年10月12日星期二下午 01:43 <table style="table-layout:

曾经终败给现在/ 2022年01月15日 14:59/ 0 赞/ 268 阅读

相关 C#TextBox 失去与获取焦点事件

textBox5.LostFocus += new EventHandler(txt\_LostFocus); //失去焦点后发生事件 textBo

╰+攻爆jí腚メ/ 2022年01月06日 10:53/ 0 赞/ 746 阅读