-1
我想用HTML和Javascript的用戶界面做一個計算器。我修復了很多錯誤，但仍然存在如下問題：如果第二個操作員不止一個數字，則答案錯誤，並且分區不起作用。我是相當新的，我知道我的代碼效率低下，300行太長，但有人可以幽默我，並解釋我的錯誤？Javascript用戶界面計算器
var resultline_str = " ";
\t \t \t var multidigit = 0
\t \t \t var space = 0
\t \t \t var operating = [];
\t \t \t
\t \t \t function type1(){
\t \t \t \t resultline_str += " 1";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t if(multidigit === 0){
\t \t \t \t \t operating.push(1);
\t \t \t \t \t multidigit = 1;
\t \t \t \t }else{
\t \t \t \t \t if(space === 0){
\t \t \t \t \t \t var n = operating[0]
\t \t \t \t \t \t n = operating[0].toString();
\t \t \t \t \t \t n += '1';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[0] = n;
\t \t \t \t \t }else{
\t \t \t \t \t \t var n = operating[2]
\t \t \t \t \t \t n = operating[2].toString();
\t \t \t \t \t \t n += '1';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[2] = n;
\t \t \t \t \t };
\t \t \t \t };
\t \t \t };
\t \t \t
\t \t \t function type2(){
\t \t \t \t resultline_str += " 2";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t if(multidigit === 0){
\t \t \t \t \t operating.push(2);
\t \t \t \t \t multidigit = 1;
\t \t \t \t }else{
\t \t \t \t \t if(space === 0){
\t \t \t \t \t \t var n = operating[0]
\t \t \t \t \t \t n = operating[0].toString();
\t \t \t \t \t \t n += '2';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[0] = n;
\t \t \t \t \t }else{
\t \t \t \t \t \t var n = operating[2]
\t \t \t \t \t \t n = operating[2].toString();
\t \t \t \t \t \t n += '2';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[2] = n;
\t \t \t \t \t };
\t \t \t \t };
\t \t \t };
\t \t \t
\t \t \t function type3(){
\t \t \t \t resultline_str += " 3";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t if(multidigit === 0){
\t \t \t \t \t operating.push(3);
\t \t \t \t \t multidigit = 1;
\t \t \t \t }else{
\t \t \t \t \t if(space === 0){
\t \t \t \t \t \t var n = operating[0]
\t \t \t \t \t \t n = operating[0].toString();
\t \t \t \t \t \t n += '3';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[0] = n;
\t \t \t \t \t }else{
\t \t \t \t \t \t var n = operating[2]
\t \t \t \t \t \t n = operating[2].toString();
\t \t \t \t \t \t n += '3';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[2] = n;
\t \t \t \t \t };
\t \t \t \t };
\t \t \t };
\t \t \t
\t \t \t function type4(){
\t \t \t \t resultline_str += " 4";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t if(multidigit === 0){
\t \t \t \t \t operating.push(4);
\t \t \t \t \t multidigit = 1;
\t \t \t \t }else{
\t \t \t \t \t if(space === 0){
\t \t \t \t \t \t var n = operating[0]
\t \t \t \t \t \t n = operating[0].toString();
\t \t \t \t \t \t n += '4';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[0] = n;
\t \t \t \t \t }else{
\t \t \t \t \t \t var n = operating[2]
\t \t \t \t \t \t n = operating[2].toString();
\t \t \t \t \t \t n += '4';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[2] = n;
\t \t \t \t \t };
\t \t \t \t };
\t \t \t };
\t \t \t
\t \t \t function type5(){
\t \t \t \t resultline_str += " 5";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t if(multidigit === 0){
\t \t \t \t \t operating.push(5);
\t \t \t \t \t multidigit = 1;
\t \t \t \t }else{
\t \t \t \t \t if(space === 0){
\t \t \t \t \t \t var n = operating[0]
\t \t \t \t \t \t n = operating[0].toString();
\t \t \t \t \t \t n += '5';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[0] = n;
\t \t \t \t \t }else{
\t \t \t \t \t \t var n = operating[2]
\t \t \t \t \t \t n = operating[2].toString();
\t \t \t \t \t \t n += '5';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[2] = n;
\t \t \t \t \t };
\t \t \t \t };
\t \t \t };
\t \t \t
\t \t \t function type6(){
\t \t \t \t resultline_str += " 6";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t if(multidigit === 0){
\t \t \t \t \t operating.push(6);
\t \t \t \t \t multidigit = 1;
\t \t \t \t }else{
\t \t \t \t \t if(space === 0){
\t \t \t \t \t \t var n = operating[0]
\t \t \t \t \t \t n = operating[0].toString();
\t \t \t \t \t \t n += '6';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[0] = n;
\t \t \t \t \t }else{
\t \t \t \t \t \t var n = operating[2]
\t \t \t \t \t \t n = operating[2].toString();
\t \t \t \t \t \t n += '6';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[2] = n;
\t \t \t \t \t };
\t \t \t \t };
\t \t \t };
\t \t \t
\t \t \t function type7(){
\t \t \t \t resultline_str += " 7";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t if(multidigit === 0){
\t \t \t \t \t operating.push(7);
\t \t \t \t \t multidigit = 1;
\t \t \t \t }else{
\t \t \t \t \t if(space === 0){
\t \t \t \t \t \t var n = operating[0]
\t \t \t \t \t \t n = operating[0].toString();
\t \t \t \t \t \t n += '7';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[0] = n;
\t \t \t \t \t }else{
\t \t \t \t \t \t var n = operating[2]
\t \t \t \t \t \t n = operating[2].toString();
\t \t \t \t \t \t n += '7';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[2] = n;
\t \t \t \t \t };
\t \t \t \t };
\t \t \t };
\t \t \t
\t \t \t function type8(){
\t \t \t \t resultline_str += " 8";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t if(multidigit === 0){
\t \t \t \t \t operating.push(8);
\t \t \t \t \t multidigit = 1;
\t \t \t \t }else{
\t \t \t \t \t if(space === 0){
\t \t \t \t \t \t var n = operating[0]
\t \t \t \t \t \t n = operating[0].toString();
\t \t \t \t \t \t n += '8';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[0] = n;
\t \t \t \t \t }else{
\t \t \t \t \t \t var n = operating[2]
\t \t \t \t \t \t n = operating[2].toString();
\t \t \t \t \t \t n += '8';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[2] = n;
\t \t \t \t \t };
\t \t \t \t };
\t \t \t };
\t \t \t function type9(){
\t \t \t \t resultline_str += " 9";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t if(multidigit === 0){
\t \t \t \t \t operating.push(9);
\t \t \t \t \t multidigit = 1;
\t \t \t \t }else{
\t \t \t \t \t if(space === 0){
\t \t \t \t \t \t var n = operating[0]
\t \t \t \t \t \t n = operating[0].toString();
\t \t \t \t \t \t n += '9';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[0] = n;
\t \t \t \t \t }else{
\t \t \t \t \t \t var n = operating[2]
\t \t \t \t \t \t n = operating[2].toString();
\t \t \t \t \t \t n += '9';
\t \t \t \t \t \t n = parseInt(n);
\t \t \t \t \t \t operating[2] = n;
\t \t \t \t \t };
\t \t \t \t };
\t \t \t };
\t \t \t function type_plus(){
\t \t \t \t resultline_str += " +";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t operating.push('+');
\t \t \t \t multidigit = 0;
\t \t \t \t place = 2;
\t \t \t };
\t \t \t
\t \t \t function type_minus(){
\t \t \t \t resultline_str += " -";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t operating.push('-');
\t \t \t \t multidigit = 0;
\t \t \t \t place = 2;
\t \t \t };
\t \t \t
\t \t \t
\t \t \t function equals(){
\t \t \t \t if(operating.length != 3){
\t \t \t \t \t document.getElementById('result').innerHTML = 'Error';
\t \t \t \t \t multidigit = 0;
\t \t \t \t \t place = 0;
\t \t \t \t \t return;
\t \t \t \t }else{
\t \t \t \t \t if(operating[1] === '+'){
\t \t \t \t \t \t resultline_str = resultline_str + '<br/>' + (parseInt(operating[0]) + parseInt(operating[2])) + '<br/>';
\t \t \t \t \t }else if(operating[1] === '-'){
\t \t \t \t \t \t resultline_str = resultline_str + '<br/>' + (parseInt(operating[0]) - parseInt(operating[2])) + '<br/>';
\t \t \t \t \t }else if(operating[1] === '*'){
\t \t \t \t \t \t resultline_str = resultline_str + '<br/>' + (parseInt(operating[0]) * parseInt(operating[2])) + '<br/>';
\t \t \t \t \t }else if(operating[1] === '/'){
\t \t \t \t \t \t resultline_str = resultline_str + '<br/>' + (parseInt(operating[0])/parseInt(operating[2])) + '<br/>';
\t \t \t \t \t };
\t \t \t \t };
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t operating = [];
\t \t \t \t multidigit = 0;
\t \t \t \t place = 0;
\t \t \t };
\t \t \t
\t \t \t function clear_line(){
\t \t \t \t resultline_str = " ";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t operating = [];
\t \t \t \t multidigit = 0;
\t \t \t \t place = 0;
\t \t \t };
\t \t \t
\t \t \t function times(){
\t \t \t \t resultline_str += " *";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t operating.push('*');
\t \t \t \t multidigit = 0;
\t \t \t \t place = 2;
\t \t \t };
\t \t \t
\t \t \t function divide(){
\t \t \t \t resultline_str += " /";
\t \t \t \t document.getElementById('result').innerHTML = resultline_str;
\t \t \t \t operating.push('-');
\t \t \t \t multidigit = 0;
\t \t \t \t place = 2;
\t \t \t };body{
\t \t \t \t background-color:lightblue;
\t \t \t }
\t \t \t #head{
\t \t \t \t background-color:blue;
\t \t \t \t color:white;
\t \t \t \t padding:10px;
\t \t \t \t margin:10 auto;
\t \t \t \t text-align:center;
\t \t \t \t font-size:20px;
\t \t \t \t font-family:courier;
\t \t \t \t border:5px solid grey;
\t \t \t }
\t \t \t #grid{
\t \t \t \t height:510px;
\t \t \t \t width:260px;
\t \t \t \t background-color:blue;
\t \t \t \t color:white;
\t \t \t \t border-collapse:collapse;
\t \t \t \t border:10px solid black;
\t \t \t \t float:left;
\t \t \t \t margin-right:10px;
\t \t \t \t
\t \t \t }
\t \t \t td{
\t \t \t \t padding:30px;
\t \t \t \t font-size:40px;
\t \t \t \t size:400%;
\t \t \t \t font-family:courier;
\t \t \t \t font-weight:bold;
\t \t \t }
\t \t \t #result{
\t \t \t \t float:right;
\t \t \t \t height:525px;
\t \t \t \t width:950px;
\t \t \t \t background-color:white;
\t \t \t \t border:2px solid black;
\t \t \t \t text-align:right;
\t \t \t \t font-size:45px;
\t \t \t \t font-family:courier;
\t \t \t \t font-weight:strong;
\t \t \t }<div id="head">
\t \t \t <h1>Calculator<h1>
\t \t </div>
\t \t <div id="grid">
\t \t
\t \t <!-- calculator buttons -->
\t \t <table>
\t \t \t <tr>
\t \t \t \t <td id="1" onclick='type1()'>1</td>
\t \t \t \t <td id="2" onclick='type2()'>2</td>
\t \t \t \t <td id="3" onclick='type3()'>3</td>
\t \t \t </tr>
\t \t \t <tr>
\t \t \t \t <td id="4" onclick='type4()'>4</td>
\t \t \t \t <td id="5" onclick='type5()'>5</td>
\t \t \t \t <td id="6" onclick='type6()'>6</td>
\t \t \t </tr>
\t \t \t <tr>
\t \t \t \t <td id="7" onclick='type7()'>7</td>
\t \t \t \t <td id="8" onclick='type8()'>8</td>
\t \t \t \t <td id="9" onclick='type9()'>9</td>
\t \t \t </tr>
\t \t \t <tr>
\t \t \t \t <td id="=" onclick='equals()'>=</td>
\t \t \t \t <td id="+" onclick='type_plus()'>+</td>
\t \t \t \t <td id="-" onclick='type_minus()'>-</td>
\t \t \t </tr>
\t \t \t <tr>
\t \t \t \t <td id="times" onclick='times()'>X</td>
\t \t \t \t <td id="clear" onclick='clear_line()'>C</td>
\t \t \t \t <td id="divide" onclick='divide()'>%</td>
\t \t \t </tr>
\t \t </table>
\t \t </div>
<div id="result">
\t \t <b></b>
\t \t </div>
每當你看到你在你的代碼中重複某件事意味着你做錯了什麼。我指的是你的九個'typeX'函數，它基本上是一個函數，只有一個參數。 – Shomz
首先，您每次都重複相同的功能。我將創建一個名爲type（parameter）的函數，因此當用戶單擊鍵2時，您可以按如下所示調用函數：type（2）。加號，減號，除法和時間也是如此。 在全球範圍內，可變保護等方面存在很多錯誤。希望能幫助到你。 – wilsotobianco
您需要注意模式，然後創建您看到重複的功能。這就是你的代碼太長的原因。其次，你應該考慮閱讀關於分流碼算法，這將幫助你解決第二操作數和其他問題 – Gacci