HTML+CSSに基づいて、jQueryが作成した簡易計算機の後続(キーボードリスニングを追加)

8683 ワード

以前は簡単な計算機を発表していましたが、今日は修正してキーボードのリスニングイベントを追加しました.マウスで点点する必要はありません.
JSコード:

var yunSuan = 0;//     ,0-   ;1-  ;2-  ;3-  ;4-  
var change = 0;//               
var num1 = 0;//        
var num2 = 0;//        
var cunChuValue = 0;//      
$(function() {
$(".number").click(function() {//         
var num = $(this).attr('name');
var oldValue = $("#jieguo").html();
if (change == 1) {
oldValue = "0";
change = 0;
}
var newValue = "";
if (num == -1) {
oldValue = parseFloat(oldValue);
newValue = oldValue * -1;
} else if (num == ".") {
if (oldValue.indexOf('.') == -1)
newValue = oldValue + ".";
else
newValue = oldValue;
} else {
if (oldValue == 0 && oldValue.indexOf('.') == -1) {
newValue = num;
} else {
newValue = oldValue + num;
}
}
$("#jieguo").html(newValue);
});
$("#qingPing").click(function() {//         
$("#jieguo").html("0");
yunSuan = 0;
change = 0;
num1 = 0;
num2 = 0;
});
$("#tuiGe").click(function() {//         
if (change == 1) {
yunSuan = 0;
change = 0;
}
var value = $("#jieguo").html();
if (value.length == 1) {
$("#jieguo").html("0");
} else {
value = value.substr(0, value.length - 1);
$("#jieguo").html(value);
}
});
$(".yunSuan").click(function() {//           
change = 1;
yuSuan = $(this).attr('name');
var value = $("#jieguo").html();
var dianIndex = value.indexOf(".");
if (dianIndex == value.length) {
value = value.substr(0, value.length - 1);
}
num1 = parseFloat(value);
});
$("#dengYu").click(function() {//           
var value = $("#jieguo").html();
var dianIndex = value.indexOf(".");
if (dianIndex == value.length) {
value = value.substr(0, value.length - 1);
}
num2 = parseFloat(value);
var sum = 0;
if (yuSuan == 1) {
sum = num1 + num2;
} else if (yuSuan == 2) {
sum = num1 - num2;
} else if (yuSuan == 3) {
sum = num1 * num2;
} else if (yuSuan == 4) {
sum = num1 / num2;
} else if (yuSuan == 0 || num1 == 0 || num2 == 0) {
sum = num1 + num2;
}
var re = /^[0-9]+.?[0-9]*$/;
if (re.test(sum)) {
sum = sum.toFixed(2);
}
$("#jieguo").html(sum);
change = 1;
yuSuan = 0;
num1 = 0;
num2 = 0;
});
$("#cunChu").click(function() {//         
change = 1;
var value = $("#jieguo").html();
var dianIndex = value.indexOf(".");
if (dianIndex == value.length) {
value = value.substr(0, value.length - 1);
}
cunChuValue = parseFloat(value);
});
$("#quCun").click(function() {//         
change = 1;
$("#jieguo").html(cunChuValue);
});
$("#qingCun").click(function() {//         
change = 1;
cunChuValue = 0;
});
$("#leiCun").click(function() {//         
change = 1;
var value = $("#jieguo").html();
var dianIndex = value.indexOf(".");
if (dianIndex == value.length) {
value = value.substr(0, value.length - 1);
}
cunChuValue += parseFloat(value);
});
$("#jiCun").click(function() {//         
change = 1;
var value = $("#jieguo").html();
var dianIndex = value.indexOf(".");
if (dianIndex == value.length) {
value = value.substr(0, value.length - 1);
}
if (cunChuValue == 0) {
cunChuValue = parseFloat(value);
} else {
cunChuValue = cunChuValue * parseFloat(value);
}
});
});
//     
$(document)
.keydown(
function(event) {
//     
if (((event.keyCode > 47 && event.keyCode < 58)
|| (event.keyCode > 95 && event.keyCode < 106) || (event.keyCode == 190 || event.keyCode == 110))
&& !event.shiftKey) {
keyDownNum(event.keyCode);
}
// "+"  
if ((event.keyCode == 187 && event.shiftKey)
|| event.keyCode == 107) {
keyDownYuSuan(1);
}
// "-"  
if ((event.keyCode == 189 && event.shiftKey)
|| event.keyCode == 109) {
keyDownYuSuan(2);
}
// "*"  
if ((event.keyCode == 56 && event.shiftKey)
|| event.keyCode == 106) {
keyDownYuSuan(3);
}
// "/"  
if (event.keyCode == 191 || event.keyCode == 111) {
keyDownYuSuan(4);
}
// "="  
if ((event.keyCode == 187 && !event.shiftKey)
|| event.keyCode == 13) {
$("#dengYu").click();
}
// "  "  
if (event.keyCode == 8) {
$("#tuiGe").click();
return false;
}
// "  "  
if (event.keyCode == 27 || event.keyCode == 46
|| (event.keyCode == 110 && event.shiftKey)) {
$("#qingPing").click();
return false;
}
// "  "  
if (event.keyCode == 112) {
$("#cunChu").click();
return false;
}
// "  "  
if (event.keyCode == 113) {
$("#quCun").click();
return false;
}
// "  "  
if (event.keyCode == 114) {
$("#leiCun").click();
return false;
}
// "  "  
if (event.keyCode == 115) {
$("#jiCun").click();
return false;
}
// "  "  
if (event.keyCode == 117) {
$("#qingCun").click();
return false;
}
});
/**
*         value 1-'+' 2-'-' 3-'*' 4-'/'
*/
function keyDownYuSuan(value) {
change = 1;
yuSuan = value;
var value = $("#jieguo").html();
var dianIndex = value.indexOf(".");
if (dianIndex == value.length) {
value = value.substr(0, value.length - 1);
}
num1 = parseFloat(value);
}
/**
*        code ASCLL 
*/
function keyDownNum(code) {
var number = 0;
if (code == 48 || code == 96) {// "0"  
number = 0;
}
if (code == 49 || code == 97) {// "1"  
number = 1;
}
if (code == 50 || code == 98) {// "2"  
number = 2;
}
if (code == 51 || code == 99) {// "3"  
number = 3;
}
if (code == 52 || code == 100) {// "4"  
number = 4;
}
if (code == 53 || code == 101) {// "5"  
number = 5;
}
if (code == 54 || code == 102) {// "6"  
number = 6;
}
if (code == 55 || code == 103) {// "7"  
number = 7;
}
if (code == 56 || code == 104) {// "8"  
number = 8;
}
if (code == 57 || code == 105) {// "9"  
number = 9;
}
if (code == 190 || code == 110) {// "."  
number = ".";
}
var num = number;
var oldValue = $("#jieguo").html();
if (change == 1) {
oldValue = "0";
change = 0;
}
var newValue = "";
if (num == -1) {
oldValue = parseFloat(oldValue);
newValue = oldValue * -1;
} else if (num == ".") {
if (oldValue.indexOf('.') == -1)
newValue = oldValue + ".";
else
newValue = oldValue;
} else {
if (oldValue == 0 && oldValue.indexOf('.') == -1) {
newValue = num;
} else {
newValue = oldValue + num;
}
}
$("#jieguo").html(newValue);
} 


HTML/CSSコード:






     





メモリ(F)
(F)
チェックアウト
クリアスクリーン
(F)
(F)
クリア(F)
  ÷  
    
    
    
  ×  
    
    
    
  -  
    
    
    
  +  
    
  .  
  +/-  
  =  
コンピュータのスタイルのレイアウトの に の を にして、しかしコードはすべて が で いたので、 の のためテストに に わなかったで、 の は の の でバグがあることを して することを して、 に を んで、ありがとうございます.