javascript - 入力しながら、リアルタイムの文字と文字を比較します

Question

ユーザーが入力ボックスに入力ボックスで紹介した世界を「リアルタイム」で特定の単語（つまり「家」）と比較するコードを記述したいと思います。書かれた文字が正しい場合は単語全体が青色になり、ユーザーが間違った文字を導入すると単語は赤色になります。

これはhtmlです：

<input id='inputtype' onkeyup='return validateAsYouType(this);' />

編集：解決しました！解決策は次のとおりです。

<script type="text/javascript" >
function validateAsYouType(inputElementId)
{
var val = inputElementId.value;
var randomWord = "house";

if (val.length <= randomWord.length && val == randomWord.substr(0, val.length)) {
document.getElementById("inputtype").style.color="blue"; // If right, put it in blue
}

else { document.getElementById("inputtype").style.color="red"; // If wrong, put it in red
}

if( val == randomWord)
{
    document.getElementById("inputtype").style.color="#339933"; // If right, put it in green
}

}

score 1 · Accepted Answer

入力された単語が指定された単語より長くないこと、およびこれまでに入力された単語が指定された単語の対応する文字と同じであることを確認します。

if (val.length <= randomWord.length && val == randomWord.substr(0, val.length))

また、単語が間違っている場合に色を変更するには、 elseforステートメントも必要です。if

score 0 · Accepted Answer

これを試して、

function validateAsYouType(inputElementId)
{
    var val = inputElementId.value;
    var randomWord = "house";

    var elem = document.getElementById("inputtype");

    if( val == randomWord)
    {
        elem.style.color="#339933"; // If right, put it in green
    }

    else
    {
        elem.style.color="blue"; //if wrong, put it in blue
    }

}

コードからの多くの変更はなく、else「リアルタイム」チェックを示すだけです

リンクのテスト

score 0 · Accepted Answer

単語全体が正しいかどうかを確認するビットの下で、単語 ( valand randomword) から文字配列を作成し、現在の文字を他の配列の同じ番号の文字と比較して、1 つの配列をループします。

何かのようなもの：

for(int i = 0; i <= val.length; i++)
{
  if (valArr[i] != randomwordArr[i])
  document.getElementById("inputtype").style.color="#990000"; 
  return;
  next i;
}

いずれかが false の場合は文字列を赤に変更し、そうでない場合はそのままの色のままにします。

javascript - 入力しながら、リアルタイムの文字と文字を比較します

3 に答える 3

Related

Reference