JavaScript 网页计算器代码, 该计算器是用 dw 写的!
html 篇
<html <head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <title> 计算器 </title> <link href = "Style/calculator.css" rel = "stylesheet" type = "text/css"/> < src = "javascript/calculator.js"> </script> </head> <body> <form id = "form1" name = "form1" method = "post" action = ""> <table cellpadding = "0" cellspacing = "0" id = name = "txt" type = "text" id = "txt" value = "0" onfocus = "this.blur ();"/> </td> </tr> <tr> <td align = "center" valign = "กลาง" onclick = "backspace ();"> ← </td> <td align = "center" valign = "กลาง" onclick = "sign ();"> ± </td> <td align = "center" valign = "กลาง" onclick = "เพิ่ม () onclick = "คำสั่ง (7);"> 7 </td> <td align = "center" valign = "กลาง" onclick = "คำสั่ง (8);"> 8 </td> <td align = "center" valign = "กลาง" onclick = "คำสั่ง (9);"> 9 </td> <td </tr> <tr> <td align = "center" valign = "กลาง" onclick = "คำสั่ง (4);"> 4 </td> <td align = "center" valign = "กลาง" onClick = "คำสั่ง (5);"> 5 </td> valign = "middle" onclick = "multiply ();"> × </td> </tr> <tr> <td align = "center" valign = "middle" onclick = "คำสั่ง (1);"> 1 </td> <td align = "center" valign = "กลาง" onclick = "คำสั่ง (3);"> 3 </td> <td align = "center" valign = "กลาง" onclick = "divid ();"> ÷ </td> </tr> <tr> <td allign = "center" valign = "กลาง" onclick = "dot ();"> ▪ </td> <td colspan = "2" align = "center" valign = "กลาง" bgcolor = "#cc6600" onclick = "equal ();"> = </td> </tr>
CSS 篇
@Charset "UTF-8";/ * เอกสาร CSS */. TRB {Font-Family: Georgia, "Times New Roman", Times, Serif; ขนาดตัวอักษร: 24px; สี: #FFF; พื้นหลังสี: #333; TEXT-ALIGN: CENTER; ชายแดน: 1px Solid #999;}. Operator {พื้นหลังสี: #333; ขนาดตัวอักษร: 18px; สี: #c60; Font-Family: Verdana, Geneva, Sans-Serif;} TD: Hover {Font-Size: 28px; เคอร์เซอร์: ตัวชี้; } .txt {ความสูง: 100px; ความกว้าง: 320px; พื้นหลังสี: #333; TEXT-ALIGN: ซ้าย; แนวตั้ง-แนว: ด้านล่าง; สี: #FFF; ขนาดตัวอักษร: 30px;}JavaScript 篇
// 实现计算器功能 // 结果 var result = 0; // 显示框中的数(默认为 显示框中的数(默认为“ 0”) var screennum = "0"; // 数的初始输入状态, 默认为默认为 0 ;当按了任意运算符键后, 数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为数的输入状态变为等于号等于号等于号等于号等于号等于号) 等于号))))))))),,, สตริง (document.form1.txt.value); // 对该值进行判断, 如果该值不为 "0", 且输入状态 0, 则返回前者, 否则为否则为 "" (双重三目运算) // 两个判断条件: 1 、显示框中值是否为 "0", 2 、数的输入状态 str = (str! = "0")? ((state == 0)? str: ""): ""; // 给当前值追加字符 str = str + string (num); // 刷新显示 document.form1.txt.value = str; // 按了任意数字键后, 数的输入状态变为 0 สถานะ = 0; // 重置防止重复按键หลีกเลี่ยง repeat = true;} // 第二步:,, 每个数至多只有一个小数点 function dot () {var str = string (document.form1.txt.value); // 若该数前面未接运算符, 则返回前值, 否则为 "0"; str = (state == 0)? str: "0"; // java 里สตริง有ความยาว () 方法, 而 js 里สตริง有ความยาว属性สำหรับ (i = 0; i <= str.length; i ++) {// substr () 获取下标从 i 开始, 个数为 1 个的子串 if (str.substr (i, 1) == ".") }} // 若无小数点, 则在该数后面加上 str = str+"."; // 刷新显示 document.form1.txt.value = str; // 恢复数的初始输入状态 state = 0; } // 第三步: 处理退格键 function backspace () {var str = string (document.form1.txt.value); // 若显示框中数不等于 "0", 则返回 str, 否则返回 "" str = (str! = "0")? str: ""; // 获取子串 str = str.substr (0, str.length-1); // 若 str 不为 "", 则返回子串 str, 否则 str = "0" str = (str! = "")? str: "0"; // 刷新显示 document.form1.txt.value = str; } // 第四步: 删除所有 function deleeteAll () {// 显示框设为 "0" document.form1.txt.value = "0"; // 恢复数的初始输入状态 state = 0; // 恢复运算符键, 默认为 0-- 等于号 operator = 0;} // 第五步: 加法ฟังก์ชันเพิ่ม () {// 调用计算函数คำนวณ (); // 更改数的输入状态 State = 1; // 更改运算符键, 1-- ผู้ดำเนินการ = 1; } // 第六步: 减法ฟังก์ชันลบ () {// 调用计算函数คำนวณ (); // 更改数的输入状态 State = 1; // 2-- 减号 operator = 2; } // 第七步: 乘法ฟังก์ชั่นคูณ () {// 调用计算函数คำนวณ (); // 更改数的输入状态 State = 1; // 3-- 乘号 Operator = 3; } // 第八步: 除法 divide function () {// 调用计算函数คำนวณ (); // 更改数的输入状态 State = 1; // 4-- 除号 operator = 4; } // 第九步: 正负号 function sign () {// 5-- 正负号 operator = 5; // 调用计算函数คำนวณ (); // 更改数的输入状态 State = 1; // 0-- 等于号 operator = 0; // 正负号可以连续按หลีกเลี่ยง repeat = true;} // 第十步: 等于ฟังก์ชั่นเท่ากัน () {// 调用计算函数คำนวณ (); // 更改数的输入状态 State = 1; // 0-- 等于号 operator = 0; } // 第十一步: 计算ฟังก์ชั่นคำนวณ () {// 获取显示框中的值 screennum = number (document.form1.txt.value); if (aviardrepeat) {switch (operator) {กรณีที่ 1: result = result = screennum; document.form1.txt.value = ผลลัพธ์; หยุดพัก; กรณีที่ 2: ผลลัพธ์ = ผลลัพธ์ - ScreenNum; document.form1.txt.value = ผลลัพธ์; หยุดพัก; กรณีที่ 3: ผลลัพธ์ = ผลลัพธ์ * ScreenNum; document.form1.txt.value = ผลลัพธ์; หยุดพัก; กรณีที่ 4: ถ้า (screennum == 0) {// 设置显示框的值 document.getElementById ("txt"). value = "除数不能为 0"; // 3S 后, 执行清屏函数 settimeout (ClearScreen, 3000); } else {result = result/screennum; document.form1.txt.value = ผลลัพธ์; } หยุดพัก; กรณีที่ 5: ผลลัพธ์ = (-1)*ScreenNum; document.form1.txt.value = ผลลัพธ์; หยุดพัก; กรณีที่ 0: ผลลัพธ์ = ScreenNum; document.form1.txt.value = ผลลัพธ์; หยุดพัก; } // 当按了运算符键后, 不能再按หลีกเลี่ยง repeat = false; }} // 第十二步: 清屏函数 function clearscreen () {document.getElementById ("txt"). value = "0"; -以上就是本文的全部内容, 希望对大家的学习有所帮助, 也希望大家多多支持武林网。