手记

onfoucs和onblur

一个例子

<html>
    <head>
        <title>Blur focus事件</title>
        <meta charset="utf-8">
    </head>
    <body>
        <script type = "text/javascript">
            /*
            * 实现的功能:
            *   当用户点击框准备输入时(focus),将输入框内的东西置为空
            *   当用户离开(blur)时,检验输入的内容是否符合要求
            *
            * */
            function ClearUser(){                document.formUser.txtUser.value = "";
            }            function ClearPsd(){                document.formUser.txtPsd.value = "";
            }            function CheckUser(){                if (document.formUser.txtUser.value == "user") {                    document.formUser.txtPsd.focus();
                }
            }            function CheckPsd(){                if (document.formUser.txtPsd.value == "123456") {
                    alert("输入的密码正确");
                }
            }        </script>

        <form name = "formUser">
            <input type="text" name="txtUser" value="请输入用户名" onblur="CheckUser()" onfocus="ClearUser()"/>
            <input type="text" name="txtPsd" onblur="CheckPsd()" onfocus="ClearPsd()">
        </form>
    </body></html>

知识点

1、获取input的输入值:

// 原生方式document.表单的name.input的name.value// jquery方式



作者:椰果粒
链接:https://www.jianshu.com/p/b8072f9c2c63


0人推荐
随时随地看视频
慕课网APP