我试图从粘贴的代码中的事件处理程序中获得'firstInput'和'secondInput'的值，但控制台(日志)在运行它时产生'undefined'。你能帮我解决这个问题吗?它按预期运行(这很好)，但我似乎无法从事件处理程序中获得输入的输入值。通过HTML输入的作为数字的输入值是我需要进行一些计算的
function calc(){
// Target input's value. Goal is to get values from input
let firstButton = document.getElementById("button1");
let secondButton = document.getElementById("button2");
let pOneInput, pTwoInput;
firstButton.addEventListener("click", (e)=>{
let firstInput = document.getElementById("first-input").value;
if (firstInput != parseInt(firstInput)){
console.log("NAN");
alert("Please enter a number");
} else{
console.log(firstInput);
pOneInput = firstInput;
}
});
secondButton.addEventListener("click", (e)=>{
let secondInput = document.getElementById("sec-input").value;
if (secondInput != parseInt(secondInput)){
console.log("NAN");
alert("Please enter a number");
} else{
console.log(secondInput);
pTwoInput = secondInput;
}
});
// Select values from input.
// Compare values to see which is higher
}
calc();<body>
<div class="container">
<section class="top-container">
<div class="topdiv">
<div><p id="title">GuessNTime</p></div>
<div class="darktheme">
<input class="" type="checkbox" id="theme">
<label class="" for="theme">
Dark Theme
</label>
<span id="howtoplay">How to play</span>
</div>
</div>
</section>
<section class="middle">
<div id="left" class="left"></div>
<div class="lysol">
<div class="">
<div class="">
<div id="filter" class="">
</div>
</div>
<div class="">
</div>
</div>
<div class="themain">
<div id="count"><span id="twenty">20</span><span id="arraw">⇣</span></div>
<div class="">
<div class="gamevideo">
<video id="myvid" class="ourvid" muted></video>
</div>
</div>
<div class="othervideo">
<div id="peerDiv" class="">
</div>
</div>
</div>
<div class="gamebox">
<div class="gameplay">GameBox</div>
<div class="gameplay">ClueBox</div>
</div>
</div>
<div id="right" class="right"></div>
</section>
<section class="april">
<div id="firstcol" class="bottomlayer">
<p id="player1" class="goaway">Player One</p>
<div id="firstformdiv" class="formdiv">
<input id="first-input" type="text" value="">
<input id="button1" type="button" value="Submit">
</div>
</div>
<span id="replacediv"><div id="secondcol" class="bottomlayer" href="#modal"><p id="starpause">Start | Pause</p></div></span>
<div id="thirdcol" class="bottomlayer">
<p id="player2" class="goaway">Player Two</p>
<div id="secformdiv" class="formdiv">
<input id="sec-input" type="text" value="" class="form-input">
<input id="button2" type="button" value="Submit">
</div>
</div>
</section>
<section id="qform" class="form">
</section>
</div>Console打印Console .log(myVar)，而不是Console (log)，但你在代码中正确地写它，所以它' ok。
您可以使用isNaN(var)来代替:firstInput != parseInt(firstInput)input.valueworks.
let input = document.getElementById('myInput');
// before writing in the input
consol.log(input.value) // undefined
// after writing
consol.log(input.value) // "What I write in my input"
因此，在使用.value之前，您需要控制台log document.getElementById("first-input")来验证它是否正确获得。您应该在控制台中收到一个html字符串，如:
<input ... />