JavaScript - 如何防止多个操作员输入? 加减法

问题描述

如何防止多个操作员的输入?

喜欢添加验证,如果我按 + 它会显示操作,如果我按 - 因为最后一个字符是 + 应该替换它。

如果最后一个字符是 + 然后我再次按 +,它不应该附加像 ++ 这样的加号。

代码如下:

function ins(val) {
    document.getElementById("txtField").value += val
}

function clr() {
    document.getElementById("txtField").value = ""
}

function solve() {
    let x = document.getElementById("txtField").value
    let y = eval(x)
    document.getElementById("txtField").value = y
}
body {
    background-color: whitesmoke;
    text-align: center;
}
<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="style.css">
        <script src="script.js"></script>
    </head>
    <body>
        <h2>Add & Sub by CJ</h2>
        <input type="text" id="txtField" readonly>
        <br>
        <input type="button" value="1" onclick="ins('1')">
        <input type="button" value="2" onclick="ins('2')">
        <input type="button" value="3" onclick="ins('3')">
        <br>
        <input type="button" value="4" onclick="ins('4')">
        <input type="button" value="5" onclick="ins('5')">
        <input type="button" value="6" onclick="ins('6')">
        <br>
        <input type="button" value="7" onclick="ins('7')">
        <input type="button" value="8" onclick="ins('8')">
        <input type="button" value="9" onclick="ins('9')">
        <br>
        <input type="button" value="0" onclick="ins('0')">
        <br>
        <br>
        <input type="button" value="-" onclick="ins('-')">
        <input type="button" value="+" onclick="ins('+')">
        <input type="button" value="Clear" onclick="clr()">
        <input type="button" value="=" onclick="solve()">

        <br>
    </body>
</html>

解决方法

我更新了您的代码,请立即检查它是否会根据您的要求工作。快乐编码!

var i=-1;var j=-1;

function ins(val) {
      i=-1;
      j=-1;
   var str= document.getElementById("txtField").value += val;
   
    
}

function minsins(val) {
      j++
      if(j==0){
       var str= document.getElementById("txtField").value += val;
      }
  
   
    
}
function plusins(val) {
      i++
   if(i==0){
       var str= document.getElementById("txtField").value += val;
      }
  
    
}

function clr() {
    document.getElementById("txtField").value = ""
}

function solve() {
    let x = document.getElementById("txtField").value
    let y = eval(x)
    document.getElementById("txtField").value = y
}
body {
    background-color: whitesmoke;
    text-align: center;
}
<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="style.css">
        <script src="script.js"></script>
    </head>
    <body>
        <h2>Add & Sub by CJ</h2>
        <input type="text" id="txtField" readonly>
        <br>
        <input type="button" value="1" onclick="ins('1')">
        <input type="button" value="2" onclick="ins('2')">
        <input type="button" value="3" onclick="ins('3')">
        <br>
        <input type="button" value="4" onclick="ins('4')">
        <input type="button" value="5" onclick="ins('5')">
        <input type="button" value="6" onclick="ins('6')">
        <br>
        <input type="button" value="7" onclick="ins('7')">
        <input type="button" value="8" onclick="ins('8')">
        <input type="button" value="9" onclick="ins('9')">
        <br>
        <input type="button" value="0" onclick="ins('0')">
        <br>
        <br>
        <input type="button" value="-" onclick="minsins('-')">
        <input type="button" value="+" onclick="plusins('+')">
        <input type="button" value="Clear" onclick="clr()">
        <input type="button" value="=" onclick="solve()">

        <br>
    </body>
</html>

,

你也可以试试这个:)

function ins(val) {
    let str = document.getElementById("txtField").value;
    let size = document.getElementById("txtField").value.length-1;
    if(val!=='+'&&val!=='-'){
       document.getElementById("txtField").value += val
    }else{
      if(size>-1){
        if(document.getElementById("txtField").value.charAt(size)!=='+' && document.getElementById("txtField").value.charAt(size)!=='-'){
          document.getElementById("txtField").value += val
        }else {
          if(val==='-'){
            if(document.getElementById("txtField").value.charAt(size)==='+'){
              document.getElementById("txtField").value=str.substring(0,size)+val
            }
          }else{
            if(document.getElementById("txtField").value.charAt(size)==='-'){
              document.getElementById("txtField").value=str.substring(0,size)+val
            }
          }
        }  
      }
    }
}

function clr() {
    document.getElementById("txtField").value = ""
}

function solve() {
    let x = document.getElementById("txtField").value
    let y = eval(x)
    document.getElementById("txtField").value = y
}
body {
    background-color: whitesmoke;
    text-align: center;
}
<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="style.css">
        <script src="script.js"></script>
    </head>
    <body>
        <h2>Add & Sub by CJ</h2>
        <input type="text" id="txtField" readonly>
        <br>
        <input type="button" value="1" onclick="ins('1')">
        <input type="button" value="2" onclick="ins('2')">
        <input type="button" value="3" onclick="ins('3')">
        <br>
        <input type="button" value="4" onclick="ins('4')">
        <input type="button" value="5" onclick="ins('5')">
        <input type="button" value="6" onclick="ins('6')">
        <br>
        <input type="button" value="7" onclick="ins('7')">
        <input type="button" value="8" onclick="ins('8')">
        <input type="button" value="9" onclick="ins('9')">
        <br>
        <input type="button" value="0" onclick="ins('0')">
        <br>
        <br>
        <input type="button" value="-" onclick="ins('-')">
        <input type="button" value="+" onclick="ins('+')">
        <input type="button" value="Clear" onclick="clr()">
        <input type="button" value="=" onclick="solve()">

        <br>
    </body>
</html>