A simple calculator based on html+css,jquery (added keyboard sniffing) _jquery

Source: Internet
Author: User
Tags clear screen

Previously released a simple calculator, today made a change, added a keyboard monitoring event, no longer use the mouse point of order

JS Code:

var Yunsuan = 0;//operation symbol, 0-no operation; 1-addition; 2-subtraction; 3-multiplication; 4-division var change = 0;//after operator needs to empty previous value var NUM1 = 0;//operation First Data var num2 = 0;/ /operation the second data var cunchuvalue = 0;//stored value $ (function () {$ (". Number"). Click (function () {//Hit digital trigger event var num = $ (this). attr (' n
Ame ');
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 () {//Click on the screen to trigger event $ ("#jieguo"). HTML ("0"); yunsuan = 0; change = 0; num1 = 0; num2 = 0;}); $ ("#tuiGe"). Click (function () {//Point Repel Case trigger event if (change = = 1) {Yunsuan = 0; change = 0;} var value = $ ("#jieguo"). html (); F (value.length = = 1) {$ ("#jieguo"). HTML ("0");} else {valUE = VALUE.SUBSTR (0, value.length-1);
$ ("#jieguo"). HTML (value);
}
});
$ (". Yunsuan"). Click (function () {//click on the operator symbol to trigger the event 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 () {//click equals symbol to trigger event var value = $ ("#jieguo"). html (); var dianindex = Value.indexof ("."); if (Dian
Index = = 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 () {//Click Save TriggerEvent 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 () {//Click to save trigger event change = 1; $ ("#jieguo"). HTML (cunchuvalue);});
$ ("#qingCun"). Click (function () {//Click to save trigger event change = 1; cunchuvalue = 0;}); $ ("#leiCun"). Click (function () {//Click on the memory trigger event 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 () {//Click accumulate trigger Event 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 = Parsef
Loat (value);
else {cunchuvalue = Cunchuvalue * parsefloat (value);}});
}); Press the button to listen for $ (document). KeyDown (function (event) {//Digital listening if ((event.keYcode > && Event.keycode < 58) | | (Event.keycode > && event.keycode < 106) | |
(Event.keycode = = 190 | | event.keycode = 110)) &&!event.shiftkey) {keydownnum (event.keycode);}//"+" Listening for if ((Event.keycode = = 187 && Event.shiftkey) | |  Event.keycode = = {Keydownyusuan (1);}//"-" listening if (Event.keycode = = 189 && event.shiftkey) | | event.keycode = = 109) {Keydownyusuan (2);}//"*" Monitor if ((Event.keycode = && event.shiftkey) | | event.keycode =) {key
Downyusuan (3); //"/" monitor if (Event.keycode = = 191 | | event.keycode =) {Keydownyusuan (4);}//"=" Listen for if (Event.keycode = 187 ;&!event.shiftkey) | |  Event.keycode = = {$ ("#dengYu"). Click ();//fallback to listen for if (Event.keycode = = 8) {$ ("#tuiGe"). Click (); return false;// "Clear Screen" monitor if (Event.keycode = | | event.keycode = 46 | | (Event.keycode = = && Event.shiftkey))
{$ ("#qingPing"). Click (); return false;} "Store" listening if (Event.keycode = 112){$ ("#cunChu"). Click (); return false;} "Fetch" listens for if (Event.keycode = = 113) {$ ("#quCun"). Click (); return false;//"" listening if (Event.keycode = = 114) {$ ("#leiCu
N "). Click ();
return false; //"Accumulate" listen for if (Event.keycode = = * * * * * ("#jiCun"). Click (); return false;//"Clear" listen if (Event.keycode = = 117) {$ ("#qin
Gcun "). Click ();
return false;
}
}); /** * Key Trigger operator 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);  /** * Key triggers digital code ASCLL code/function Keydownnum (code) {var number = 0; if (code = = | | code = 96) {//"0" monitor
0; } if (code = = | | code = = 97) {//"1" listens for number = 1;} if (code = = | | code = = 98) {//"2" listener number = 2;} if (Code = = 51 | | Code = = 99) {//"3" Listener number = 3;} if (Code = | | code = = 100) {//"4" Listener number = 4;} if (code = N1) {//"5" Listener number = 5;} if (code = n | | code = = 102) {//"6" monitor number = 6;} if (Code = = | code = = 103) {//"7" Monitor
Number = 7; } if (code = = | | code = = 104) {//"8" listens for number = 8;} if (code = = | | code = = 105) {//"9" Monitor number = 9;} if (code = = 190 | | Code = = 110) {//"."
Monitor 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 Code:

<%@ page language= "java" contenttype= "text/html; charset=utf-"pageencoding=" utf-"%> <! DOCTYPE html>  

Calculator style layout to draw on others, but the code is my own writing, due to the time reason did not have a chance to test, heroes in the use of the process found that there are bugs welcome to put forward, common learning progress, thank you.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.