jQuery計算器連加效果實現
在Web開發中,計算器是一個常見的功能。使用jQuery,可以輕松實現一個功能強大的計算器,包括連加功能。以下是實現連加功能的jQuery代碼示例:
$(document).ready(function() { // 定義計算器操作數 var num1 = 0; var num2 = 0; var total = 0; var operator = ""; var isNewNum = true; var isDecimal = false; // 數字按鈕點擊事件處理函數 $("button.num").click(function() { if(isNewNum) { $("#result").val($(this).text()); isNewNum = false; } else { $("#result").val($("#result").val() + $(this).text()); } }); // 連加按鈕點擊事件處理函數 $("button.add").click(function() { if(operator == "") { num1 = parseFloat($("#result").val()); operator = "+"; isNewNum = true; } else { num2 = parseFloat($("#result").val()); total += num1+num2; $("#result").val(total); isNewNum = true; } }); // 計算按鈕點擊事件處理函數 $("button.calc").click(function() { num2 = parseFloat($("#result").val()); if(operator == "+") { total += num1 + num2; } else if(operator == "-") { total += num1 - num2; } else if(operator == "*") { total += num1 * num2; } else if(operator == "/") { total += num1 / num2; } num1 = total; $("#result").val(total); isNewNum = true; operator = ""; total = 0; }); });
以上jQuery代碼實現了一個帶有連加功能的基本計算器。注意,在連續點擊“+”按鈕時,程序會計算前一個數字和后一個數字的和,并將結果疊加到結果框中。
下一篇div css 清除