时间戳

首页 > 解决方案 > 如何停止代码让用户在输入中输入以下值

javascript - 如何停止代码让用户在输入中输入以下值

问题描述

我做了一些计算器，希望用户轮流输入第一个和第二个值。我需要在用户输入第一个值时停止程序，并在用户在同一输入字段中输入第二个值时继续。用户继续按 html 代码中的“=”按钮或“Enter”。

$('#plus').on('click', function(){
    var firstNum = $("#txt").val()
    $("input").val('')
    if (isResult === true || $("input").keypress() === 13){
        var secondNum = $("#txt").val()
        result = Number(firstNum)+Number(secondNum)
        console.log(result) 
}

<input type='text' id='txt' value='' onpaste="return false" placeholder="Enter number" />

标签： javascriptjquery

解决方案

您可以在页面加载时隐藏第二个输入元素（和等号按钮），然后在用户单击操作符时显示输入（和等号按钮）以使其更具交互性。

您可以在这个令人惊叹的网站上获得有关在隐藏和显示元素之间切换的更多信息：https ://www.w3schools.com/howto/howto_js_toggle_hide_show.asp

var firstNum;
var secondNum;

var first_in = document.getElementById("txt1");
var sec_in = document.getElementById("txt2");
var equal = document.getElementById("equals");
sec_in.style.display = "none";
equal.style.display = "none";

$('#plus').on('click', function() {
  if (firstNum === undefined) {
    firstNum = Number($("#txt1").val());
    sec_in.style.display = "block";
    equal.style.display = "block";
  } 
});

$('#equals').on('click', function() {
  if (secondNum === undefined) {
    secondNum = Number($("#txt2").val());
    var result = firstNum + secondNum;
    console.log(result);
  } 
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='text' id='txt1' value='' onpaste="return false" placeholder="Enter first number" />
<button type="button" id="plus">+</button>
<input type='text' id='txt2' value='' onpaste="return false" placeholder="Enter second number" />
<button type="button" id="equals">=</button>

推荐阅读