Question

我有一个问题：我不为什么，但是我的简单计算器无法正常工作。如果单击计算器的任何->“我的按钮”，则无任何作用，并且Javascript未执行。没有传递数字或运算符以在->“ #screen”中显示。您知道问题出在哪里吗？

HTML文件：

<BODY>

<table>

<tr>
<td id="buttonCE">C</td>
<td colspan=3 id="screen" >0</td>
</tr>

<tr>
  <td  class="buttonNumber" >7</td>
  <td  class="buttonNumber" >8</td>
  <td  class="buttonNumber" >9</td>
  <td  class="buttonNumber" >/</td>
</tr>

<tr>
  <td  class="buttonNumber" >4</td>
  <td  class="buttonNumber" >5</td>
  <td  class="buttonNumber" >6</td>
  <td  class="buttonOperator" >-</td>
</tr>

<tr>
  <td  class="buttonNumber" >1</td>
  <td  class="buttonNumber" >2</td>
  <td  class="buttonNumber" >3</td>
  <td  class="buttonOperator" >+</td>
</tr>

<tr>
  <td  class="buttonNumber">0</td>
  <td  class="buttonOperator" >.</td>
  <td  id="buttonResult" >=</td>
  <td  class="buttonOperator">*</td>
</tr>
</table>

<script src="new.js"></script> 
<script src="app.js"></script>      

</BODY>

JAVASCRIPT CODE-NEW.JS：

'use strict'


var screen = document.querySelector('#screen').textContent




 const eraseFunction = () => {  
    const ceKey = document.querySelector('#buttonCE')
    debugger
    ceKey.onclick = function(e) {
    screen = "" }
}


const resultFunction = () => {
    const resultKey = document.querySelector('#buttonResult') 
    resultKey.onclick = () => {
        let lastCharOfScreen = screen[screen.length-1]
        if (lastCharOfScreen!='+' || lastCharOfScreen!='-' || lastCharOfScreen!='/' || lastCharOfScreen!='*' || lastCharOfScreen!='.' ) {
            screen = eval(screen) }
        else {
            screen = eval(screen.substring(0, screen.length))
        }
    }

}


const numberFunction = () => {
    let numberKeys = document.querySelectorAll('.buttonNumber')
    for (let i=0; i<numberKeys.length; i++) {
        numberKeys[i].onclick = () => {
            let buttonNumberValue = this.innerHTML
            if (screen.length!=1 && screen!=0) {
                screen += buttonNumberValue
            }

        }
    }
}


const operatorFunction = () => {
    let operatorKeys = document.querySelectorAll('.buttonOperator')
    for (let i=0; i<operatorKeys.length; i++) {
        operatorKeys[i].onclick = (e) => {
            let buttonOperatorValue = this.innerHTML
            let lastCharOfScreen = screen[screen.length-1]

            // 1st conditional
            if (screen.length = 0 && buttonOperatorValue=="-") {
                screen+=buttonOperatorValue
            }


            if (screen.length>0) {
            // 2nd conditional
                if (lastCharOfScreen!=buttonOperatorValue) {
                screen += buttonNumberValue
                }

        }
    }
    }

}

JAVASCRIPT CODE-> APP.JS：

'use strict'

eraseFunction()
resultFunction()
numberFunction()
operatorFunction()

Answer 1

您有一些语法错误。

在这里您尝试将screen.length设置为0，这是无效的。长度是只读的。

if (screen.length = 0 && buttonOperatorValue=="-") {

应该是：

if (screen.length == 0 && buttonOperatorValue=="-") {

此处buttonNumberValue未定义。不确定您的意思是什么

if (screen.length>0) {
    // 2nd conditional
    if (lastCharOfScreen!=buttonOperatorValue) {
         screen += buttonNumberValue
    }
}

我还建议使用分号结束JavaScript语句并正确设置代码格式。

我强烈建议您查看控制台中的错误。如果不自己查看错误并进行调试，您将走得很远。

计算器-单击按钮不起作用

1 个答案: