javascript - 在文本字段中输入特定字符串时触发按钮单击以更改 div？

Question

我正在开发一个简短的测验游戏，我似乎无法弄清楚如何/什么事件监听器适合检测文本框中的特定字符串。这是我到目前为止所拥有的(仅当“else if”部分被取出时才有效 - 没有检测到特定的字符串)

HTML:

    <div id="ques1" class="ques">
     <img src="img/img1.png" alt="">

     <div id="btncontainer" class="btncontainer">
      <input id="txtbox" placeholder="Type here"/>
      <button id="go1" class="gobttn"><i>NEXT<i></button>
     </div>
    </div>

    <div id="ques2" class="ques">
     <img src="img/img2.png" alt="">
    </div>

JS:

var s2 = document.getElementById('ques1')
var s3 = document.getElementById('ques2')

var b1 = document.getElementById('landbtn')
var b2 = document.getElementById('go1')

var tbox = document.getElementById('txtbox')

function Quest1To2() {
 s2.style.display = 'none';
 s3.style.display = 'block';
}
b2.addEventListener('click', Quest1To2)

function TxtErr() {
 tbox.style.outline = '0.2em solid red';
}
b2.addEventListener('click', TxtErr)


var a1 = "NEO";  
var answer = txtbox.value

if (answer == a1) {
  Quest1To2();
}

else if () {
  TxtErr();
}

Answer 1

您可以使用 input 事件在 tbox 发生输入时调度事件。

tbox.oninput = function(e) {
  if (e.target.value == a1) {
    Quest1To2();
  }
  else {
    TxtErr();
  }
}