onfocus事件,onblur事件；Focus()方法,Blur()方法

Posted 2020-09-18 clnchanpin

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了onfocus事件,onblur事件；Focus()方法,Blur()方法相关的知识，希望对你有一定的参考价值。

<1>

<pre name="code" class="html"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript"></script>
    <!--  注意在使用$的时候须要引入Jqery-->
    <!-- $("input[name=‘name‘]")-->
    <script src="Jquery/jquery-1.4.1.min.js" type="text/javascript"></script>


    <script type="text/javascript">
        function checkValue(obj) {

            if (obj.value == "") {
                alert("长度不能为空");
                obj.value = "长度不能为空";
            }
        } 

        function checkGetfocus(obj) {
            //将当前控件的value设为"哥获得了焦点"
            obj.value = "哥获得了焦点"

        }
    </script>
</head>
<!--当页面载入完成。usernameGetfocus文本框获得焦点-->
<body onload="$(‘#Getfocus‘).focus()">

        <!--================================================================================================-->
        <!--当用户点击“焦点”按钮的时候id=Getfocus文本框获得焦点-->
        <input type="text" id="Getfocus" />

        <!--blur()失去焦点方法-->
        <input type="button" value="Getfocus失去焦点" onclick="document.getElementById(‘Getfocus‘).blur() " />

        <!--focus()获得焦点方法-->
        <input type="button" value="Getfocus获得焦点" onclick="document.getElementById(‘Getfocus‘).focus();" />
        
        <!--================================================================================================-->

        <!--onblur失去焦点事件-->
        <input type="text" name="txt1" onblur="checkValue(this)" />
        <input type="text" name="txt2" onblur="checkValue(this)" />
        <input type="text" name="txt3" onblur="checkValue(this)" />
        <hr />
        <!---------------------------------------------------------------------------------------------------->
        <!--onfocus获得焦点事件-->
        <!--   this就是指当前控件本身，onfocus这个事件触发后，这个事件就会调用checkGetfocus函数，在调用这个函数的时候会把当前控件本身(自己)作为參数（this）传递给处理函数checkGetfocus，-->
        <input type="text" name="t1" onfocus="checkGetfocus(this)" />
        <input type="text" name="t1" onfocus="checkGetfocus(this)" />
        <input type="text" name="t1" onfocus="checkGetfocus(this)" />
        <!--================================================================================================-->
</body>
</html>

以上是关于onfocus事件,onblur事件；Focus()方法,Blur()方法的主要内容，如果未能解决你的问题，请参考以下文章

input文本框获取焦点和失去焦点事件判断

jquery使用on给input绑定focus事件和alert组合后无限弹出

onblur事件和onfocus事件失效

DOM事件类型总结大全

JS事件失焦事件（onblur）onblur事件与onfocus是相对事件，当光标离开当前获得聚焦对象的时候，触发onblur事件，同时执行被调用的程序。

onblur,onfocus事件