本文目录一览：
- 1、如何使用javascript编写一个计算器
- 2、计算器使用JS代码如下，请高手做个连等功能？
- 3、计算器怎么用JS写
- 4、用JS脚本实现网页计算器！！求代码！求高手！！！！
- 5、用js代码做一个简易计算器
如何使用javascript编写一个计算器
首先，由于JS的存在数值的精度误差问题：
0.1+0.2 //0.30000000000000004
0.3-0.1 //0.19999999999999998
所以在编写计算器是应首先解决计算精度问题，以下四个代码段分别是js中精确的加减乘除运算函数
//浮点数加法运算
function floatAdd(arg1,arg2){
var r1,r2,m;
try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}
try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}
m=Math.pow(10,Math.max(r1,r2));
return (arg1*m+arg2*m)/m
}
//浮点数减法运算
function floatSub(arg1,arg2){
var r1,r2,m,n;
try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}
try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}
m=Math.pow(10,Math.max(r1,r2));
//动态控制精度长度
n=(r1=r2)?r1:r2;
return ((arg1*m-arg2*m)/m).toFixed(n);
}
//浮点数乘法运算
function floatMul(arg1,arg2){
var m=0,s1=arg1.toString(),s2=arg2.toString();
try{m+=s1.split(".")[1].length}catch(e){}
try{m+=s2.split(".")[1].length}catch(e){}
return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m)
}
//浮点数除法运算
function floatDiv(arg1,arg2) {
var t1 = 0, t2 = 0, r1, r2;
try {t1 = arg1.toString().split(".")[1].length} catch (e) {}
try {t2 = arg2.toString().split(".")[1].length} catch (e) {}
with (Math) {
r1 = Number(arg1.toString().replace(".", ""));
r2 = Number(arg2.toString().replace(".", ""));
return (r1 / r2) * pow(10, t2 - t1);
}
}
以下是详细的计算器代码：
HTML5
!DOCTYPE html
html lang="en"
head
meta charset="UTF-8"
title简单计算器/title
link href="main.css" rel="stylesheet"
/head
body
div id="calculator"
div id="calculator_container"
h3计算器/h3
table id="calculator_table"
tbody
tr
td colspan="5"
input type="text" id="resultIpt" readonly="readonly" value="" size="17" maxlength="17" style="width:294px;color: black"
/td
/tr
tr
tdinput type="button" value="←" class="btn_color1 btn_operation"/td
tdinput type="button" value="全清" class="btn_color1 btn_operation"/td
tdinput type="button" value="清屏" class="btn_color1"/td
tdinput type="button" value="﹢/﹣" class="btn_color2 btn_operation"/td
tdinput type="button" value="1/×" class="btn_color2 btn_operation"/td
/tr
tr
tdinput type="button" value="7" class="btn_color3 btn_number"/td
tdinput type="button" value="8" class="btn_color3 btn_number"/td
tdinput type="button" value="9" class="btn_color3 btn_number"/td
tdinput type="button" value="÷" class="btn_color4 btn_operation"/td
tdinput type="button" value="％" class="btn_color2 btn_operation"/td
/tr
tr
tdinput type="button" value="4" class="btn_color3 btn_number"/td
tdinput type="button" value="5" class="btn_color3 btn_number"/td
tdinput type="button" value="6" class="btn_color3 btn_number"/td
tdinput type="button" value="×" class="btn_color4 btn_operation"/td
tdinput type="button" value="√" class="btn_color2 btn_operation"/td
/tr
tr
tdinput type="button" value="1" class="btn_color3 btn_number"/td
tdinput type="button" value="2" class="btn_color3 btn_number"/td
tdinput type="button" value="3" class="btn_color3 btn_number"/td
tdinput type="button" value="－" class="btn_color4 btn_operation"/td
td rowspan="2"
input type="button" value="＝" class="btn_color2" style="height: 82px" id="simpleEqu"
/td
/tr
tr
td colspan="2"
input type="button" value="0" class="btn_color3 btn_number" style="width:112px"
/td
tdinput type="button" value="." class="btn_color3 btn_number" /td
tdinput type="button" value="＋" class="btn_color4 btn_operation"/td
/tr
/tbody
/table
/div
/div
script type="text/javascript" src="calculator.js"/script
/body
/html
CSS3
* {
margin: 0;
padding: 0;
}
#calculator{
position: relative;
margin: 50px auto;
width: 350px;
height: 400px;
border: 1px solid gray;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 2px 2px 4px gray;
-moz-box-shadow: 2px 2px 4px gray;
box-shadow: 2px 2px 4px gray;
behavior:url("ie-css3.htc"); /*IE8-*/
}
#calculator_table{
position: relative;
margin: 10px auto;
border-collapse:separate;
border-spacing:10px 20px;
}
h3{
position: relative;
width: 60px;
height: 30px;
margin: 0 auto;
}
#calculator_table td{
width: 50px;
height: 30px;
border: 1px solid gray;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
behavior:url("ie-css3.htc"); /*IE8-*/
}
#calculator_table td input{
font-size: 16px;
border: none;
width: 50px;
height: 30px;
color: white;
}
input.btn_color1{
background-color: orange;
}
input.btn_color2{
background-color: #133645;
}
input.btn_color3{
background-color: #59807d;
}
input.btn_color4{
background-color: seagreen;
}
input:active{
-webkit-box-shadow: 3px 3px 3px gray;
-moz-box-shadow: 3px 3px 3px gray;
box-shadow: 3px 3px 3px gray;
behavior:url("ie-css3.htc"); /*IE8-*/
}
JS
window.onload=function() {
var resultIpt = document.getElementById("resultIpt"); //获取输出文本框
var btns_number = document.getElementsByClassName("btn_number"); //获取数字输入按钮
var btns_operation = document.getElementsByClassName("btn_operation"); //获取操作按钮
var simpleEqu = document.getElementById("simpleEqu"); //获取"="按钮
var temp = "";
var num1= 0,num2=0;
//获取第一个数
for(var i=0;ibtns_number.length;i++){
btns_number[i].onclick=function (){
temp += this.value;
resultIpt.value = temp;
};
}
//对获取到的数进行操作
for(var j=0;jbtns_operation.length;j++) {
btns_operation[j].onclick = function () {
num1=parseFloat(resultIpt.value);
oper = this.value;
if(oper=="1/×"){
num1 = Math.pow(num1,-1); //取倒数
resultIpt.value = num1.toString();
}else if(oper=="﹢/﹣"){ //取相反数
num1 = -num1;
resultIpt.value = num1.toString();
}else if(oper=="√"){ //取平方根
num1 =Math.sqrt(num1);
resultIpt.value = num1.toString();
}else if(oper=="←"){ //删除个位
resultIpt.value = resultIpt.value.substring(0, resultIpt.value.length - 1);
}else if(oper=="全清"){ //清除数字
resultIpt.value = "";
}
else{ //oper=="＋" "－" "×" "÷" "％"时，继续输入第二数字
temp = "";
resultIpt.value = temp;
}
}
}
//输出结果
simpleEqu.onclick=function(){
num2=parseFloat(temp); //取得第二个数字
calculate(num1, num2, oper);
resultIpt.value = result.toString();
}
};
//定义一个计算函数
function calculate(num1, num2, oper) {
switch (oper) {
case "＋":
result=floatAdd(num1, num2); //求和
break;
case "－":
result=floatSub(num1, num2); //求差
break;
case "×":
result=floatMul(num1, num2); //求积
break;
case "÷":
result=floatDiv(num1, num2); //求商
break;
case "％":
result=num1%num2; //求余数
break;
}
}
//精确计算
//浮点数加法运算
function floatAdd(arg1,arg2){
var r1,r2,m;
try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}
try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}
m=Math.pow(10,Math.max(r1,r2));
return (arg1*m+arg2*m)/m
}
//浮点数减法运算
function floatSub(arg1,arg2){
var r1,r2,m,n;
try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}
try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}
m=Math.pow(10,Math.max(r1,r2));
//动态控制精度长度
n=(r1=r2)?r1:r2;
return ((arg1*m-arg2*m)/m).toFixed(n);
}
//浮点数乘法运算
function floatMul(arg1,arg2){
var m=0,s1=arg1.toString(),s2=arg2.toString();
try{m+=s1.split(".")[1].length}catch(e){}
try{m+=s2.split(".")[1].length}catch(e){}
return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m)
}
//浮点数除法运算
function floatDiv(arg1,arg2) {
var t1 = 0, t2 = 0, r1, r2;
try {t1 = arg1.toString().split(".")[1].length} catch (e) {}
try {t2 = arg2.toString().split(".")[1].length} catch (e) {}
with (Math) {
r1 = Number(arg1.toString().replace(".", ""));
r2 = Number(arg2.toString().replace(".", ""));
return (r1 / r2) * pow(10, t2 - t1);
}
}
计算器使用JS代码如下，请高手做个连等功能？
就是用个变量判断是否按下过= 按下就变真 按数字键就变假
计算结果时候 先判断那个变量 假的话就正常计算
真的话就把之前的结果和之前的运算符号同之前第二个运算数 计算
计算器怎么用JS写
FORM NAME="Calc"
TABLE BORDER=4TRTD
INPUT TYPE="text" NAME="Input" Size="16"br
/TD/TRTRTD
!-- all the buttons go here, just add as many as you like! -- INPUT TYPE="button" NAME="one" VALUE=" 1 " OnClick="Calc.Input.value += '1'" INPUT TYPE="button" NAME="two" VALUE=" 2 " OnCLick="Calc.Input.value += '2'" INPUT TYPE="button" NAME="three" VALUE=" 3 " OnClick="Calc.Input.value += '3'" INPUT TYPE="button" NAME="plus" VALUE=" + " OnClick="Calc.Input.value += ' + '"br INPUT TYPE="button" NAME="four" VALUE=" 4 " OnClick="Calc.Input.value += '4'" INPUT TYPE="button" NAME="five" VALUE=" 5 " OnCLick="Calc.Input.value += '5'" INPUT TYPE="button" NAME="six" VALUE=" 6 " OnClick="Calc.Input.value += '6'" INPUT TYPE="button" NAME="minus" VALUE=" - " OnClick="Calc.Input.value += ' - '"br INPUT TYPE="button" NAME="seven" VALUE=" 7 " OnClick="Calc.Input.value += '7'" INPUT TYPE="button" NAME="eight" VALUE=" 8 " OnCLick="Calc.Input.value += '8'" INPUT TYPE="button" NAME="nine" VALUE=" 9 " OnClick="Calc.Input.value += '9'" INPUT TYPE="button" NAME="times" VALUE=" x " OnClick="Calc.Input.value += ' * '"br INPUT TYPE="button" NAME="clear" VALUE=" c " OnClick="Calc.Input.value = ''" INPUT TYPE="button" NAME="zero" VALUE=" 0 " OnClick="Calc.Input.value += '0'" INPUT TYPE="button" NAME="DoIt" VALUE=" = " OnClick="Calc.Input.value = eval(Calc.Input.value)"
INPUT TYPE="button" NAME="div" VALUE=" / " OnClick="Calc.Input.value += ' / '"br
/TD/TR
/TABLE
/FORM
用JS脚本实现网页计算器！！求代码！求高手！！！！
C#的要不。。。
C#软件中也能做js
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
namespace WindowsFormsApplication2
{
public partial class 计算机 : Form
{
double Num1 = 0;//这三行是考虑计算时候要用的
double Num2 = 0;//这三行是考虑计算时候要用的
string op = "";//这三行是考虑计算时候要用的
public 计算机()
{
InitializeComponent();
}
private void btnNum1_Click(object sender, EventArgs e)
{
if (txtResult.Text != "")
{
double temp = double.Parse(txtResult.Text);//这个是做开平方的。。。
temp = Math.Sqrt(temp);
txtResult.Text = temp.ToString();
}
}
private void button6_Click(object sender, EventArgs e)
{
if (txtResult.Text != "")
{
double temp = double.Parse(txtResult.Text);//这个是那个“阶乘键的”用的是“！”标记。
double factor = 1;
for (int i = 1; i = temp; i++)
factor = factor * i;
txtResult.Text = factor.ToString();
}
}
private void btnNum1_Click_1(object sender, EventArgs e)
{
Button btn = sender as Button;//这个是第一步：要在计算器中输入数字的。。。
txtResult.Text += btn.Text;
}
private void btnNum3_Click(object sender, EventArgs e)
{
if (txtResult.Text != "")
{
double temp = double.Parse(txtResult.Text);//这个是那个“正弦函数”。。
temp = Math.Sin(temp);
txtResult.Text = temp.ToString();
}
}
private void btnPoint_Click(object sender, EventArgs e)
{
if (txtResult.Text == "")
{
txtResult.Text = "0.";//这个是“小数点”问题。。。要考虑到：1、一串数字中不能出现两个小数点。。2.第一个输入小数点时问题
}
else
{
if (txtResult.Text.IndexOf(".") == -1)
{
txtResult.Text += ".";
}
}
}
private void btnNum0_Click(object sender, EventArgs e)
{
Button btn = sender as Button;//这是数字“0”的问题。。首先不能第一个为0.。。
if (txtResult.Text == "0")
{
txtResult.Text = btn.Text;
}
else
{
txtResult.Text += btn.Text;
}
}
private void btnAdd_Click(object sender, EventArgs e)
{
Button btn = sender as Button;//这是解决当第一个按“+”号时程序出错的状况。。。
if (txtResult.Text != "")
Num1 = double.Parse(txtResult.Text);
op = btn.Text;
txtResult.Text = "";
}
private void btnCalculate_Click(object sender, EventArgs e)
{
double result = 0;
Num2 = double.Parse(txtResult.Text);/////这是处理“=”的问题。。。不过还有些不足。。
switch (op)
{
case "+": result = Num1 + Num2; break;
case "-": result = Num1 - Num2; break;
case "*": result = Num1 * Num2; break;
case "/": result = Num1 / Num2; break;
default: result = 0; break;
}
txtResult.Text = result.ToString();
}
private void btnClear_Click(object sender, EventArgs e)
{
txtResult.Text = "";///////////////这是处理”清除键“的功能。。即:清除所有数字。。
Num1 = 0;
Num2 = 0;
op = "";
}
private void btnBackspace_Click(object sender, EventArgs e)
{
int len = txtResult.Text.Length;
if (len != 0)
txtResult.Text = txtResult.Text.Substring(0, len - 1);////这是处理“退格键”的问题。。即：除去最后一个数字。。。
}
private void button20_Click(object sender, EventArgs e)
{
if (txtResult.Text != "")
{
double temp = double.Parse(txtResult.Text);////这是处理“相反数”的问题。。即：先按个‘9“键。再按此键变为”-9“
temp = temp * (-1);
txtResult.Text = temp.ToString();
}
}
private void button4_Click(object sender, EventArgs e)
{
if (txtResult.Text != "")
{
double temp = double.Parse(txtResult.Text);//这是”余弦“问题。。。
temp = Math.Cos(temp);
txtResult.Text = temp.ToString();
}
}
private void button4_Click_1(object sender, EventArgs e)
{
if (txtResult.Text != "")
{
double temp = double.Parse(txtResult.Text);//////这是处理”正切“问题。。
temp = Math.Tan(temp);
txtResult.Text = temp.ToString();
}
}
}
}
用js代码做一个简易计算器
function test(){
var txt1 = document.getElementById("txt1"),
txt2 = document.getElementById("txt2"),
txt3 = document.getElementById("txt3"),
opt = document.getElementById("sel");
txt3.value = eval(txt1.value + opt.value + txt2.value);//eval函数可计算某个字符串，并执行其中的的js代码
}
input type="text" id="txt1" /
select id="sel"
option value="+"+/option
option value="-"-/option
option value="*"*/option
option value="/"//option
/select
input type="text" id="txt2" /
=
input type="text" id="txt3" /
input type="button" id="btn" value="计算" onclick="test()"/