2017-02-01 2 views
1

私は入力欄を作成しました。これはタブキーを使って検証されますが、Enterキーを押した後に検証する必要があります。ここでEnterキーで回答を検証する方法は?

enter image description here

、目盛りのシンボルが、私は正しい答えを入力し、タブを押した後にのみ表示されます。次に、次の入力ボックスに進み、検証も行われます。

しかし、正解を入力して入力ボックス自体の中の入力を押すと、検証が必要になります。私はこれを試してみましたそのために

はコード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(); 
    } 
} 

しかし、私はEnterキーを押したときにも、それは検証されません。

そして、私の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> 

enter image description here

である私は、入力ボックスの内容を消去するとき、私はまた消えたことを目盛り画像を必要としています。

答えて

2

はあなたのコードの問題は、あなたのキー押下のリスナーに、この部分でのonblurイベントのコードが正常に動作するので

checktxt(h,v,w,c) 

H、V、WとCは、ここで定義されていないとあなたは同じを複製しますエンタープレスでは、これらの変数をkeypressイベントで定義する必要があります。

あなたのhtmlをチェックした場合、あなたはあなたのJSに機能をchecktxtするためにすべての要素のidを渡しています。

同じ内側のキー押しリスナーも同様に実行します。

$(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>

+0

どうもありがとう..その作業罰金。 – Anitha

+0

入力ボックスの内容を消去すると消えてしまうティックイメージも必要です。 – Anitha

+0

@Anithaでは、入力に変更イベントリスナーをバインドし、値が空であるかどうかを確認できます。 – Deep

関連する問題