搜索框练习

失去焦点时显示：‘请输入用户名’

获得焦点时显示：空

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>搜索框练习</title>
    <script>
        //失去焦点
        function onBur() {
            var input = document.getElementById('ID1')
            if(input.value == ''){
                input.value='请输入用户名'
            }
        }
        //获得焦点
        function onfucs() {
            var input = document.getElementById('ID1')
            if (input.value == '请输入用户名'){
                input.value = ''
            }
        }
    </script>
</head>
<body>
<input type="text" value="请输入用户名" id="ID1" onblur="onBur()" onfocus="onfucs()">
</body>
</html>