JavaScript 网页计算器代码 该计算器是用 dw 写的！
HTML 篇
<html <Head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <title> 计算器 </title> <link href = "style/calculator.cs" rel = "stylessheet" type = "text/css"/> <script.cs "rel =" src = "javascript/calculator.js"> </script >> </head> <body> <form id = "form1" name = "form1" method = "post" action = ""> <таблица CellPadding = "0" Cell -Spacing = "0" ID = "Калькулятор"> <Tr> <td colSpan = "4" align = "alling" al -alculator " for = "txt"> </label> <input name = "txt" type = "text" id = "txt" value = "0" onfocus = "this.blur ();"/> </td> </tr> <tr> <td align = "center" valign = "middle" onclick = "deleteall ();> c </td> <td align =" valign = "" align = "" align = "" align = "" align = "" align = "" align = "" onclick = "backspace ();"> ← </td> <td align = "center" valign = "onclick =" sign (); "> ± </td> <td align =" center "valign =" middle "onclick =" add (); "> ＋ </td> </tr> <tr> <td align =" alend = "aled" "center =» onclick = "command (7);"> 7 </td> <td align = "center" valign = "midne" onclick = "command (8);"> 8 </td> <td align = "center" valign = "middle" onclick = "command (9);"> 9 </td> <td align = "center" valick = "Middle" onclick = "suptract ();"> － </td> </tr> <tr> <td align = "center" valign = "middle" onclick = "command (4);"> 4 </td> <td align = "center" valign = "onclick =" command (5); "> 5 </td> <td align =" valic onclick = "command (6);"> 6 </td> <td align = "center" valign = "onclick =" multiply (); "> × </td> </tr> <tr> <td align =" center "valign =" middle "onclick =" Command (1); "> 1 </td> <td align =" centright = "centrice =" valic onclick = "command (2);"> 2 </td> <td align = "center" valign = "midne" onclick = "command (3);"> 3 </td> <td align = "center" valign = "middle" onclick = "divide ();"> ÷ </td> </tr> <tr> <td align = "center =" centrage = "alend =" valign = "" center = "" alend = "" center = "" center = "" valign = "" valign = "" alend = "" onclick = "command (0);"> 0 </td> <td align = "center" valign = "onclick =" dot (); "> ▪ </td> <td colspan =" 2 "align =" center "valign =" middle "bgcolor ="#cc6600 "onclick =" valign = ＝ table> </td> </td> </td> </td> </td> </td> </td> <pc6600 ". </p> <p> </p> </form> </body> </html>
CSS 篇
@charset "utf-8";/ * css document */. trb {font-family: Georgia, "Times New Roman", Times, Serif; размер шрифта: 24px; Цвет: #fff; фоновый цвет: #333; Текст-альбом: Центр; Граница: 1PX SOLIT #999;}. Оператор {фоновое цветное: #333; размер шрифта: 18px; Цвет: #C60; Фонт-семья: Вердана, Женева, Sans-Serif;} TD: Hover {Font-Size: 28px; курсор: указатель; } .txt {height: 100px; Ширина: 320px; фоновый цвет: #333; Текст-альбом: слева; Вертикальная атака: внизу; Цвет: #fff; размер шрифта: 30px;}JavaScript 篇
// 实现计算器功能 // 结果 var result = 0; // 显示框中的数 （默认为 默认为 «0») var screenmum = "0"; // 数的初始输入状态 ， 默认为 0 ；当按了任意运算符键后 ， 数的输入状态变为 1var cate = 0; // 防止重复按运算符键 var vestrepeat = true; // 运算符键 （0-- 等于号 ：/： ： ： ： ： ： ： ： ： ： ： ： ： ： ： ： ： ： ： String (document.form1.txt.value); // 对该值进行判断 ， 如果该值不为 "0" ， 0 ， 则返回前者 ， 否则为 "" (双重三目运算) // 两个判断条件 ： 1 、显示框中值是否为 "0", 2 、数的输入状态 str = (str! = "0")? ((Состояние == 0)? Str: ""): ""; "; // 给当前值追加字符 str = str + string (num); // 刷新显示 document.form1.txt.value = str; // 按了任意数字键后 ， 数的输入状态变为 0 Состояние = 0; // 重置防止重复按键 enserepeat = true;} // 第二步 ： 确保输入的数是合法的 ， 每个数至多只有一个小数点 function dot () {var str = string (document.form1.txt.value); // 若该数前面未接运算符 ， 则返回前值 否则为 否则为 "0" ； str = (state == 0)? Str: "0"; // java 里 String 有 length () 方法 ， 而 JS 里 строка 有 длина 属性 for (i = 0; i <= str.length; i ++) {// substr () 获取下标从 i 开始 ， 个数为 1 个的子串 if (str.substr (i, 1) == ".") {// 当存在小数点时 则程序终止 则程序终止 则程序终止 则程序终止 个的子串 个的子串 个的子串 个的子串 个的子串 个的子串 个的子串 个的子串 个的子串 个的子串 if }} // 若无小数点 ， 则在该数后面加上 str = str+"."; // 刷新显示 document.form1.txt.value = str; // 恢复数的初始输入状态 состояние = 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; } // 第四步 ： 删除所有 функция deleTeall () {// 显示框设为 "0" Document.form1.txt.value = "0"; // 恢复数的初始输入状态 состояние = 0; // 恢复运算符键 ， 默认为 0-- 等于号 operator = 0;} // 第五步 ： 加法 Функция add () {// 调用计算函数 Рассчитывание (); // 更改数的输入状态 состояние = 1; // 更改运算符键 ， 1-- 加号 Оператор = 1; } // 第六步 ： 减法 Функция suptract () {// 调用计算函数 Canculate (); // 更改数的输入状态 состояние = 1; // 2-- 减号 减号 operator = 2; } // 第七步 ： 乘法 Функция умножна () {// 调用计算函数 Рассчитывание (); // 更改数的输入状态 состояние = 1; // 3-- 乘号 Оператор = 3; } // 第八步 ： 除法 Функция Divide () {// 调用计算函数 Canculate (); // 更改数的输入状态 состояние = 1; // 4-- 除号 Оператор = 4; } // 第九步 ： 正负号 Функциональный знак () {// 5-- 正负号 operator = 5; // 调用计算函数 Рассчитывать (); // 更改数的输入状态 состояние = 1; // 0-- 等于号 Operator = 0; // 正负号可以连续按 enserepeat = true;} // 第十步 ： 等于 Функция равна () {// 调用计算函数 Рассчитывает (); // 更改数的输入状态 состояние = 1; // 0-- 等于号 Operator = 0; } // 第十一步 ： 计算 Функция Calculate () {// 获取显示框中的值 Screenmum = number (document.form1.txt.value); if (veserepeat) {switch (operator) {case 1: result = result + screenmum; document.form1.txt.value = result; перерыв; Случай 2: Результат = Результат - Screenum; document.form1.txt.value = result; перерыв; Случай 3: Результат = Результат * Screenum; document.form1.txt.value = result; перерыв; Случай 4: if (screennum == 0) {// 设置显示框的值 document.getElementById ("txt"). value = "除数不能为 0"; // 3S 后 ， 执行清屏函数 SetTimeout (ClearScreen, 3000); } else {result = result/screennum; document.form1.txt.value = result; } перерыв; Случай 5: Результат = (-1)*Screenum; document.form1.txt.value = result; перерыв; Случай 0: результат = Screenum; document.form1.txt.value = result; перерыв; } // 当按了运算符键后 ， 不能再按 Избегайте repeat = false; }} // 第十二步 ： 清屏函数 Функция clearScreen () {document.getElementById ("txt"). Value = "0"; }以上就是本文的全部内容 ， 希望对大家的学习有所帮助 也希望大家多多支持武林网。