捆绑调教日本一区二区三区,精品日产乱码久久久久久仙踪林,欧美在线不卡一区

當前位置：首頁 > 范文|應用文 > IT技術專欄 > 網絡編程

JavaScript計算器網頁版實現代碼分享

來源：易賢網閱讀：1335 次日期：2016-07-27 14:55:31

溫馨提示：易賢網小編為您整理了“JavaScript計算器網頁版實現代碼分享”,方便廣大網友查閱！

這篇文章主要為大家詳細介紹了JavaScript計算器網頁版實現代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下

JavaScript網頁計算器代碼，該計算器是用DW寫的！

HTML篇

<html

<head>

</head>

<body >

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

</form>

</body>

</html>

CSS篇

@charset "utf-8";

/* CSS Document */

.trb {

font-family: Georgia, "Times New Roman", Times, serif;

font-size: 24px;

color: #FFF;

background-color: #333;

text-align: center;

border: 1px solid #999;

}

.operator {

background-color: #333;

font-size: 18px;

color: #C60;

font-family: Verdana, Geneva, sans-serif;

}

td:hover{

font-size: 28px;

cursor:pointer;

}

.txt {

height: 100px;

width: 320px;

background-color: #333;

text-align: left;

vertical-align: bottom;

color: #FFF;

font-size: 30px;

}

JavaScript篇

//實現計算器功能

//結果

var result = 0;

//顯示框中的數（默認為“0”）

var screenNum = "0";

//數的初始輸入狀態，默認為0；當按了任意運算符鍵后，數的輸入狀態變為1

var state = 0;

//防止重復按運算符鍵

var avoidRepeat = true;

//運算符鍵（默認為0--等于號）

var operator = 0;

//第一步：獲取按鍵值，并顯示在顯示框中

function command(num) {

//獲取顯示框的值

var str = String(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

state = 0;

//重置防止重復按鍵

avoidRepeat = true;

}

//第二步：確保輸入的數是合法的，每個數至多只有一個小數點

function dot() {

var str = String(document.form1.txt.value);

//若該數前面未接運算符，則返回前值，否則為"0"；

str = (state == 0)?str:"0";

//Java里String有length()方法，而JS里String有length屬性

for(i=0;i<=str.length;i++) {

//substr()獲取下標從i開始，個數為1個的子串

if(str.substr(i,1)==".") {

//當存在小數點時，則程序終止

return;

}

//若無小數點，則在該數后面加上

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 deleteAll() {

//顯示框設為"0"

document.form1.txt.value = "0";

//恢復數的初始輸入狀態

state = 0;

//恢復運算符鍵，默認為0--等于號

operator = 0;

}

//第五步：加法

function add() {

//調用計算函數

calculate();

//更改數的輸入狀態

state = 1;

//更改運算符鍵，1--加號

operator = 1;

}

//第六步：減法

function subtract() {

//調用計算函數

calculate();

//更改數的輸入狀態

state = 1;

//2--減號

operator = 2;

}

//第七步：乘法

function multiply() {

//調用計算函數

calculate();

//更改數的輸入狀態

state = 1;

//3--乘號

operator = 3;

}

//第八步：除法

function divide() {

//調用計算函數

calculate();

//更改數的輸入狀態

state = 1;

//4--除號

operator = 4;

}

//第九步：正負號

function sign() {

//5--正負號

operator = 5;

//調用計算函數

calculate();

//更改數的輸入狀態

state = 1;

//0--等于號

operator = 0;

//正負號可以連續按

avoidRepeat = true;

}

//第十步：等于

function equal() {

//調用計算函數

calculate();

//更改數的輸入狀態

state = 1;

//0--等于號

operator = 0;

}

//第十一步：計算

function calculate() {

//獲取顯示框中的值

screenNum = Number(document.form1.txt.value);

if(avoidRepeat) {

switch(operator){

case 1:

result = result + screenNum;

document.form1.txt.value = result;

break;

case 2:

result = result - screenNum;

document.form1.txt.value = result;

break;

case 3:

result = result * screenNum;

document.form1.txt.value = result;

break;

case 4:

if(screenNum == 0){

//設置顯示框的值

document.getElementById("txt").value="除數不能為0";

//3s后，執行清屏函數

setTimeout(clearScreen,3000);

}else{

result = result/screenNum;

document.form1.txt.value = result;

}

break;

case 5:

result = (-1)*screenNum;

document.form1.txt.value = result;

break;

case 0:

result = screenNum;

document.form1.txt.value = result;

break;

}

//當按了運算符鍵后，不能再按

avoidRepeat = false;

}

//第十二步：清屏函數

function clearScreen() {

document.getElementById("txt").value = "0";

}

以上就是本文的全部內容，希望對大家的學習有所幫助

上一篇：淺談javascript運算符——條件,逗號,賦值,()和void運算符

下一篇：js實現樓層效果的簡單實例

易賢網手機網站地址：JavaScript計算器網頁版實現代碼分享

由于各方面情況的不斷調整與變化，易賢網提供的所有考試信息和咨詢回復僅供參考，敬請考生以權威部門公布的正式信息和咨詢為準！

相關閱讀網絡編程

Shell中如何刪除文本比較長的行的實現方法10月30日

vue.js語法及常用指令10月30日

python 讀寫中文json的實例詳解10月30日

Objective-C Json 實例詳解10月30日

bootstrap table sum總數量統計實現方法10月30日

python生成二維碼的實例詳解10月30日

Python批量更改文件名的實現方法10月30日

解決出現Incorrect integer value的問題10月30日

jQuery實現切換隱藏與顯示同時切換圖標功能10月30日

docker python api 安裝配置的詳解10月30日

javascript按鈕禁用和啟用的效果實例代碼10月30日

vue.js todolist實現代碼10月30日

vue.js 父向子組件傳參的實例代碼10月30日

apache 開啟重定向 rewrite的實現方法10月30日

Vue.js劃分組件的方法10月30日

python logging日志模塊的詳解10月30日

vue中的scope使用詳解10月30日

docker cgroup 資源監控的詳解10月30日

使用Android Studio 開發自己的SDK教程10月23日

linux系統下MongoDB單節點安裝教程10月23日

易賢網移動網站

2026上岸·考公考編培訓報班

報班類型
姓名
手機號
驗證碼

中文字幕免费精品_亚洲视频自拍_亚洲综合国产激情另类一区_色综合咪咪久久