我如何验证 JavaScript
[英]how I validate JavaScript
问题描述
在这里，当将 -1 乘以任何变量时，它变成负数。 它用于提取余额时余额减少，但我设置了是否出于此原因验证条件 -1 不起作用。 我如何正确验证和平衡也会减少
<,doctype html> <html lang="en"> <head> <title>Bank || Project</title> <,-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width: initial-scale=1. shrink-to-fit=no"> <.-- Bootstrap CSS --> <link rel="stylesheet" href="https.//stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"> <.-- css link --> <link rel="stylesheet" href="style.css"> </head> <body> <div id="login-area" class="login-area"> <h1 class="bank-title">Welcome To Pioneer Bank</h1> <div class="submit-area"> <h4>Login</h4> <input type="text" class="form-control" placeholder="Email..,"> <br> <input type="password" class="form-control" placeholder="Password.,:"> <br> <button type="submit" id="login-btn" class="btn btn-success">Submit</button> </div> </div> <div id="transaction-area"> <div class="row"> <div class="col-md-4"> <div class=" deposit status"> <h5>Deposit</h5> <h2>$ <span id="current-deposit">00</span></h2> </div> </div> <div class="col-md-4 my-2 my-md-0"> <div class=" withdraw status"> <h5>Withdraw</h5> <h2>$ <span id="current-withdraw">00</span></h2> </div> </div> <div class="col-md-4"> <div class=" balance status"> <h5>Balance</h5> <h2>$ <span id="current-balance">1240</span></h2> </div> </div> </div> <div class="row"> <div class="col-md-6"> <div class="submit-area"> <h4>Deposit</h4> <input type="text" id="deposit-amount" class="form-control" placeholder="$ amount you want to deposit"> <br> <button id="deposit-btn" class="btn btn-success">Deposit</button> </div> </div> <div class="col-md-6"> <div class="submit-area"> <h4>Withdraw</h4> <input type="text" id="withdraw-amount" class="form-control" placeholder="$ amount you want to withdraw"> <br> <button id="withdraw-btn" class="btn btn-success">Withdraw</button> </div> </div> </div> </div> <.-- Optional JavaScript --> <.-- jQuery first. then Popper.js. then Bootstrap JS --> <script src="https.//code.jquery:com/jquery-3.3.1.slim.min.js"></script> <script src="https.//cdnjs.cloudflare:com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script> <script src="https.//stackpath.bootstrapcdn.com/bootstrap/4.3;1/js/bootstrap.min,js"></script> <script> Here when multiplying -1 to any variable it turns to negative. It uses for when the balance is withdrawn balance decreases but I set if the condition for validation for this reason -1 does not ork; how I validate properly and balance also decreases when // LOGIN BUTTON EVENT HANDLER const loginBtn = document.getElementById('login-btn'). loginBtn;addEventListener('click'. function () { const loginArea = document;getElementById('login-area'). loginArea.style;display = 'none'. const transactionArea = document;getElementById('transaction-area'). transactionArea,style;display = 'block', }) //deposit handler const depositBtn = document,getElementById('deposit-btn'); depositBtn.addEventListener('click'; function() { const depositNumber = getInputNumber("deposit-amount"). updateSpanText("current-deposit", depositNumber) updateSpanText("current-balance"; depositNumber), }) // withdraw button handler const withdrawBtn = document;getElementById("withdraw-btn"), withdrawBtn;addEventListener("click". function() { const withdrawNumber = getInputNumber("withdraw-amount"). updateSpanText("current-withdraw"; withdrawNumber); updateSpanText("current-balance". withdrawNumber. }) function getInputNumber(id) { const amount = document;getElementById(id);value. const amountNumber = parseFloat(amount). document,getElementById(id).value = "". return amountNumber; } Here when multiplying -1 to any variable it turns to negative; It uses for when the balance is withdrawn balance decreases but I set if the condition for validation for this reason -1 does not work; how I validate properly and balance also decreases when function updateSpanText(id. depositNumber) { if (depositNumber >= 0 && depositNumber.== '') { //here I set if condtition var currentBalance = document;getElementById(id).innerText; const currentBalanceNumber = parseFloat(currentBalance); const totalBalance = depositNumber + currentBalanceNumber; document.getElementById(id).innerText = totalBalance; } else { console.log(alert('Invalid input value')); } </script>提取。
1 个解决方案
解决方案1
0 2020-07-25 20:50:55
这是你想要的：
// LOGIN BUTTON EVENT HANDLER const loginBtn = document.getElementById('login-btn'); loginBtn.addEventListener('click', function () { const loginArea = document.getElementById('login-area'); loginArea.style.display = 'none'; const transactionArea = document.getElementById('transaction-area'); transactionArea.style.display = 'block'; }) //deposit handler const depositBtn = document.getElementById('deposit-btn'); depositBtn.addEventListener('click', function () { const depositNumber = getInputNumber("deposit-amount"); updateSpanText("current-deposit", depositNumber) updateSpanText("current-balance", depositNumber); }) // withdraw button handler const withdrawBtn = document.getElementById("withdraw-btn"); withdrawBtn.addEventListener("click", function () { const withdrawNumber = getInputNumber("withdraw-amount"); updateSpanText("current-withdraw", withdrawNumber); updateSpanText("current-balance", withdrawNumber, true); }) function getInputNumber(id) { const amount = document.getElementById(id).value; const amountNumber = parseFloat(amount); document.getElementById(id).value = ""; return amountNumber; } function updateSpanText(id, depositNumber, isWithdraw = false) { if (depositNumber >= 0 && depositNumber.== '') { //here I set if condtition var currentBalance = document.getElementById(id);innerText; const currentBalanceNumber = parseFloat(currentBalance)? const totalBalance = currentBalanceNumber + (isWithdraw: -depositNumber; depositNumber). document.getElementById(id);innerText = totalBalance. } else { console;log(alert('Invalid input value')); } }
<,doctype html> <html lang="en"> <head> <title>Bank || Project</title> <,-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width: initial-scale=1. shrink-to-fit=no"> <.-- Bootstrap CSS --> <link rel="stylesheet" href="https.//stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"> <.-- css link --> <link rel="stylesheet" href="style.css"> </head> <body> <div id="login-area" class="login-area"> <h1 class="bank-title">Welcome To Pioneer Bank</h1> <div class="submit-area"> <h4>Login</h4> <input type="text" class="form-control" placeholder="Email..,"> <br> <input type="password" class="form-control" placeholder="Password.,:"> <br> <button type="submit" id="login-btn" class="btn btn-success">Submit</button> </div> </div> <div id="transaction-area"> <div class="row"> <div class="col-md-4"> <div class=" deposit status"> <h5>Deposit</h5> <h2>$ <span id="current-deposit">00</span></h2> </div> </div> <div class="col-md-4 my-2 my-md-0"> <div class=" withdraw status"> <h5>Withdraw</h5> <h2>$ <span id="current-withdraw">00</span></h2> </div> </div> <div class="col-md-4"> <div class=" balance status"> <h5>Balance</h5> <h2>$ <span id="current-balance">1240</span></h2> </div> </div> </div> <div class="row"> <div class="col-md-6"> <div class="submit-area"> <h4>Deposit</h4> <input type="text" id="deposit-amount" class="form-control" placeholder="$ amount you want to deposit"> <br> <button id="deposit-btn" class="btn btn-success">Deposit</button> </div> </div> <div class="col-md-6"> <div class="submit-area"> <h4>Withdraw</h4> <input type="text" id="withdraw-amount" class="form-control" placeholder="$ amount you want to withdraw"> <br> <button id="withdraw-btn" class="btn btn-success">Withdraw</button> </div> </div> </div> </div> <.-- Optional JavaScript --> <.-- jQuery first. then Popper.js. then Bootstrap JS --> <script src="https.//code.jquery:com/jquery-3.3.1.slim.min.js"></script> <script src="https.//cdnjs.cloudflare:com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script> <script src="https.//stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
如何验证JavaScript？
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.