📄 计算器.htm
字号:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> Calculator </title>
</head>
<body>
<div id="form"></div>
<script type="text/javascript">
<!--
function Digit(){
var db_num = [0xe7,0x44,0xbd,0xdd,0x5e,0xdb,0xfb,0x45,0xff,0xdf]; //0~9点阵
var db_alpha = {'a':0x7f,'b':0xfa,'c':0xa3,'d':0xfc,'e':0xbb,'f':0x3b,'-':0x18};
this.width = 6;
this.height = 12;
this.border = 6;
this.forcolor = "#000000";
this.bgcolor = "#dddddd";
this.style = "solid";
this.get = function(num){
var obj_header = document.createElement("DIV");
var obj_footer = document.createElement("DIV");
var obj = document.createElement("DIV");
with(obj_header.style){
width = this.width + "px";
height = (this.height>>1) + "px";
borderStyle = this.style;
borderWidth = this.border + "px";
borderBottomWidth = (this.border>>1) + "px";
}
with(obj_footer.style){
width = this.width + "px";
height = (this.height>>1) + "px";
borderStyle = this.style;
borderWidth = this.border + "px";
borderTopWidth = (this.border>>1) + "px";
}
obj.appendChild(obj_header);
obj.appendChild(obj_footer);
this.set(obj,num);
return (obj);
}
this.set = function(objframe,num){
if (objframe.childNodes.length!=2)
{
return;
}
var obj_header = objframe.childNodes[0];
var obj_footer = objframe.childNodes[1];
var mask = (num.toString().charCodeAt(0)>=48&&num.toString().charCodeAt(0)<=57)?db_num[num]:db_alpha[num];
with(obj_header.style){
borderTopColor = (mask&0x1)?this.forcolor:this.bgcolor;
borderLeftColor = (mask&0x2)?this.forcolor:this.bgcolor;
borderRightColor = (mask&0x4)?this.forcolor:this.bgcolor;
borderBottomColor = (mask&0x8)?this.forcolor:this.bgcolor;
}
with(obj_footer.style){
borderTopColor = (mask&0x10)?this.forcolor:this.bgcolor;
borderLeftColor = (mask&0x20)?this.forcolor:this.bgcolor;
borderRightColor = (mask&0x40)?this.forcolor:this.bgcolor;
borderBottomColor = (mask&0x80)?this.forcolor:this.bgcolor;
}
}
}
function Calculator(){
var objDigit = new Digit();
var offsetx = 30;
var offsety = 30;
var numspace = 20;
var numdigits = 8; //8位数
var btnwidth = 20;
var btnheight = 20;
var g_totalnum = 0;
var g_num = 0;
var g_lastopt = '';
this.init = function(){
var objfrmdigit = document.createElement("DIV");
for (var i=1; i<=numdigits; i++)
{
var obj = objDigit.get(i-numdigits);
obj.id = "digit";
with(obj.style){
position = "absolute";
left = numspace*(i) + offsetx + "px";
top = offsety + "px";
}
objfrmdigit.appendChild(obj);
}
var stropt = "1234567890+-*/=abcdef";
var line_len = Math.ceil(Math.sqrt(stropt.length));
var objfrmctl = document.createElement("DIV");
for (var i=0; i<stropt.length; i++)
{
var obj = document.createElement("DIV");
with(obj.style){
position = "absolute";
left = numspace*(i%line_len+1) + offsetx + "px";
top = offsety*(Math.floor(i/line_len)+1) + 50 + "px";
}
var btn = document.createElement("INPUT");
with (btn){
type = "button";
value = stropt.charAt(i);
width = btnwidth;
height = btnheight;
}
btn.onclick = function(){
cal.setkey(100+this.value.charCodeAt(0));
};
obj.appendChild(btn);
objfrmctl.appendChild(obj);
}
document.getElementById("form").appendChild(objfrmdigit);
document.getElementById("form").appendChild(objfrmctl);
}
this.setkey = function(keycode){
if (keycode>=96 && keycode<=105) //小键盘0~9
{
keycode -=48;
}else if (keycode>=148 && keycode<=157){ //按键0~9
keycode -=100;
}else if (keycode>=196 && keycode<=205){ //按键测试a~f
this.draw(String.fromCharCode(keycode-100));
}
if (keycode>=48 && keycode<=57){ //0~9
if (g_num.toString().length<numdigits)
{
g_num = g_num*10+(keycode-48);
}
if (g_lastopt.length==0)
{
g_totalnum = g_num;
}
this.draw(g_num);
}else if (keycode==107 || keycode==143){ //＋
g_lastopt = '+';
g_num = 0;
}else if (keycode==109 || keycode==145){ //－
g_lastopt = '-';
g_num = 0;
}else if (keycode==106 || keycode==142){ //×
g_lastopt = '*';
g_num = 0;
}else if (keycode==111 || keycode==147){ //÷
g_lastopt = '/';
g_num = 0;
}else if (keycode==13 || keycode==161){ //=
switch(g_lastopt){
case '+':
g_totalnum += g_num;
break;
case '-':
g_totalnum -= g_num;
break;
case '*':
g_totalnum *= g_num;
break;
case '/':
g_totalnum = Math.floor(g_totalnum/g_num);
break;
}
g_num = 0;
g_lastopt = '';
this.draw(g_totalnum);
}else{
g_num = 0;
}
}
this.draw = function(num){
var strnum = num.toString().split('').reverse().join('');
for (var i=0,length=strnum.length; i<numdigits; i++)
{
objDigit.set(document.getElementById("form").childNodes[0].childNodes[numdigits-i-1],(strnum.substr(i,1)));
}
}
}
document.onkeydown = function(evt){
cal.setkey((evt||event).keyCode);
}
var cal = new Calculator();
cal.init();
//-->
</script>
</body>
</html>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -