如何通过输入密钥验证答案？

Question

我创建了一个输入框，通过使用tab键进行验证，但是在按下回车键后需要对其进行验证。

此处，只有在输入正确的答案然后按Tab键后才会显示刻度线符号。然后它进入下一个输入框并进行验证。

但是当我输入正确的答案并点击输入框内的输入时，需要进行验证。

为此，我尝试了这个JS代码：

$(document).keypress(function(e) {
  if(e.which == 13) {
    checktxt(h,v,w,c)
  }
});

function checktxt(h,v,w,c) {
  var th=$("#"+h).val();
  var tv=$("#"+v).val();
  if(th.toLowerCase()==tv.toLowerCase()) {
    $( "."+c ).show();
    $( "."+w ).hide(); 
  } else if(tv.toLowerCase()=="") {
  } else {
    $( "."+c ).hide();
    $( "."+w ).show();
  }
}

但是当我按下回车键时它也没有得到验证。

我的HTML代码是

<div>
  <input id="texthidden1" type="hidden" value="877" />
  <input id="textvisible1" type="text" value="" onblur="javascript:checktxt('texthidden1','textvisible1','wrong1','correct1');" />
  <div class="wrong1"><img src="../images/smallwrong.png"/></div>
  <div class="correct1"><img src="../images/smallgreen.png"/></div>
</div>

当我删除输入框的内容时，我还需要勾选图像消失。

Answer 1

代码问题是你的按键列表器

中的这一部分

checktxt(h,v,w,c) 

h，v，w和c在此处未定义，因为onblur事件的代码工作正常，并且您希望在输入时复制相同的内容，您需要在keypress事件中定义这些变量。

如果你检查你的html，你将把所有元素的id传递给你的JS中的checktxt函数。

同样在keypress侦听器内部也是如此。

 $(document).keypress(function(e) {
    if(e.which == 13) {
    checktxt('texthidden1','textvisible1','wrong1','correct1')
    }
 });

$(document).keypress(function(e) {
  if (e.which == 13) {
    checktxt('texthidden1', 'textvisible1', 'wrong1', 'correct1')
  }
});

function checktxt(h, v, w, c) {
  var th = $("#" + h).val();
  var tv = $("#" + v).val();
  if (th.toLowerCase() == tv.toLowerCase()) {
    $("." + c).show();
    $("." + w).hide();
  } else if (tv.toLowerCase() == "") {} else {
    $("." + c).hide();
    $("." + w).show();
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <input id="texthidden1" type="hidden" value="877" />
  <input id="textvisible1" type="text" value="" onblur="javascript:checktxt('texthidden1','textvisible1','wrong1','correct1');" />
  <div class="wrong1">
    <img src="../images/smallwrong.png" />
  </div>
  <div class="correct1">
    <img src="../images/smallgreen.png" />
  </div>
</div>