非常有趣的九九乘法表

<!doctype html>
<html>
<head>
<meta charset="UTF-8" />
<title>九九乘法表</title>
<style type="text/css">
    body{font-size: 12px;font-family: "微软雅黑";color: #666;}
    table{margin-top: 50px;}
    table td{border:1px solid #ccc;font-size: 14px;padding: 5px;}
    table td:hover{background:#141414;color:#fff;cursor: pointer;}
    h1{text-align: center;height: 50px;}
    .control{ 300px;height: 30px;position: absolute;top: 50px;right: 20px;}
    #number{height: 20px;outline: none;}
    #btn{60px;height:26px;border:0;border-radius: 0 3px 3px 0;outline: none;cursor: pointer;}
</style>
</head>
<body>
    <h1>非常有趣的九九乘法表</h1>
    <div>
        <input type="text" id="number"/><input type="button" onclick="change(this)" value="更换" id="btn"/>
    </div>
    <hr/>
 
    <div id="box"></div>
<script type="text/javascript">
 
    gb_changfabiao(9);
    //循环打印乘法表
    function gb_changfabiao(number){
        var html = "<table>";
        for(var i = 1; i <= number; i++){
        html += "<tr>";
        for(var j = 1; j <=i; j++){
            html += "<td>" + j + "*" + i + "=" + (i*j) + "</td>";
        }
        html += "</tr>";
        }
        html += "</table>";
     
        document.getElementById("box").innerHTML = html;
    }
     
    //获取number
    function change(obj){
        var number = document.getElementById("number").value;
        if(number == ""|| number <= 0 || isNaN(number)){
            return gb_changfabiao(9);
        }
        gb_changfabiao(number);
    }
     
    //回车确认
    document.onkeydown = function(e){
        if(!e) e = window.event;
        if((e.keyCode || e.which) == 13){
            document.getElementById("btn").click();
        }
    }
 
</script>
</body>
</html>