如何解决JavaScript - 使用函数、子字符串、大小正确输入验证？
下面的程序是一个简单的加减计算器，我一直在努力保持代码的简洁和简单，同时避免不良做法。
在validate() 函数中，我使用布尔值来判断运算符是否重复。
我正在寻找一种类似的方法，但更简单。
要求：
没有重复的操作员输入
var i = -1;var j = -1;
function ins(val) {
i=-1;
j=-1;
document.getElementById("txtField").value += val;
validate()
}
function plusIns(val) {
j++
if (j==0) {
var str = document.getElementById("txtField").value += val;
}
validate()
}
function subIns(val) {
i++
if (i==0) {
var str = document.getElementById("txtField").value += val;
}
validate()
}
function validate() {
let str = document.getElementById("txtField").value;
let size = document.getElementById("txtField").value.length-1
let n = str.includes("-+");
let m = str.includes("+-");
if (n) {
document.getElementById("txtField").value = str.substring(0,size);
}
if (m) {
document.getElementById("txtField").value = str.substring(0,size);
}
}
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 Calculator</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="subIns('-')">
<input type="button" value="+" onclick="plusIns('+')">
<input type="button" value="Clear" onclick="clr()">
<input type="button" value="=" onclick="solve()">
</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>版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
