入力ボックスを作成し、タブキーで検証します。しかし、確定ボタンを押したときにそれを検証する必要があります。入力キーを入力して回答を確認します
function checktxt(h, v, w, c) {
var th = $("#" + h).val();
var tv = $("#" + v).val();
if (th.toLowerCase() == tv.toLowerCase()) {
$("." + c).show();
$("." + w).hide();
var win = new Audio('audio/wright.mp3');
} else if (tv.toLowerCase() == "") {
} else {
$("." + c).hide();
$("." + w).show();
//setTimeout(function() { $("."+w).hide(); }, 5000);
var win = new Audio('audio/wrong.mp3');
}
win.play();
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="position:absolute; margin-left:350px;top:226px;">
<input id="texthidden1" type="hidden" value="413" />
<input id="textvisible1" type="text" value="" style="font-size:32px;text-align:center;border:0px solid black;height:50px;width:100px;" maxlength="4" onblur="javascript:checktxt('texthidden1','textvisible1','wrong1','correct1');" />
<div class="wrong1" style="margin-left: 120px;margin-top: -30px; position:absolute; float:left; display: none; margin-bottom:-30px; ">
<img src="../images/smallwrong.png" />
</div>
<div class="correct1" style="position:absolute;margin-left: 120px; margin-top: -30px; float:left; display: none; margin-bottom:-30px;">
<img src="../images/smallgreen.png" />
</div>
</div>
押されたキーがボタンを入力した場合、そこからあなた 'checktxt'関数を呼び出すキー押下ハンドラを追加し、確認してください。 –