非常に興味深い掛け算表_html/css_WEB-ITnose

< html >

<頭＞

<メタ charset = "UTF-8" />

< 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{width: 300px;height: 30px;position: absolute;top: 50px;right: 20px;}

#number{height: 20px;outline: none;}

#btn{width:60px;height:26px; border:0;border-radius: 0 3px 3px 0;outline: none;cursor: pointer;}

<本体＞

< h1 > 非常に興味深い九九乘法表

<ディビジョン >

< input type = "text" id = "number" />< input type = "button" onclick = "change(this)" value = "更换" id = "btn" />

< div id = "ボックス" >

<スクリプトタイプ = "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) + "";

}

html += "";

}

html += "";

document.getElementById("box").innerHTML = html;

}

//获取番号

function change(obj){

var number = document.getElementById("number").value;

if(number == ""|| number <= 0 || isNaN(number)){

return gb_changfabiao(9);

}

gb_changfabiao(数値);

}}

//

if((e.keyCode || e.that) == 13){

document.getElementById("btn").click();

}

}