输入代码实现文本交互功能-优快云博客

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script type="text/javascript">
        window.onload = initPage;

        function initPage()
        {
            var txts = document.getElementsByTagName("input");
            for (var i = 0; i < txts.length; i++)
            {
                var currentTxt = txts[i];
                currentTxt.onblur = showValue;
            }

            var btn = document.getElementById("btnok");
            btn.onmouseover = buttonOver;
            btn.onmouseout = buttonOut;
        }

        function showValue()
        {
            switch (this.title)//this指的是调用当前函数的对象，本处即失去焦点的文本框。
            {
                case "name":
                    alert(this.value);
                    break;
                default:
                    alert("pwd");
            }
        }

        function buttonOver()
        {
            alert("");
        }
        function buttonOut()
        {
        }

    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div id="txt">
            <input type="text" id="username" title="name" />
            <input type="text" id="password" title="pwd" />
        </div>
        <div id="btn">
            <input type="button" id="btnok" value="ok" />
        </div>
    </form>
</body>
</html>