私の機能は一度しか機能しません

Question

私の機能に問題があります。私は、JSONデータによるログインフォームの検証をしたいと思います。私のコードは正常に動作しますが、リフレッシュ直後に正しいデータを置いた場合に限ります。たとえば、誤ったログイン/パスワードを入力するとエラーが表示されますが、その後に正しいログイン/パスワードを入力すると何も起こりません。

お手伝いできれば非常に感謝します。ここに私のjsのコードは次のとおりです。

//JSON validation 
function validation(username, password){ 
    var alert = document.getElementById("invalid-data"); 
    data = JSON.parse(data); 

    for (var i=0; i < data.length; i++) { 
     if (username == data[i].login && password == data[i].password) { 
      window.open("panel.html", "_self"); 
     } else { 
      alert.style.display = "block"; 
     } 
    } 
} 

//Form validation 
function getLoginInfo() { 
    var username = document.getElementById("username").value; 
    var password = document.getElementById("password").value; 

    validation(username, password); 
} 

var button = document.getElementById("login-button"); 
button.addEventListener("click", getLoginInfo); 

Answer 1

私はあなたの問題がdata = JSON.parse(data);であることを願っています。最初に解析データを取得すると、dataに再度入れられ、次のdatajson解析で問題が発生するためです。あなたが怒鳴るのコードのような別の変数にあなた解析されdataを置けば私はあなたの問題が解決されるだろうと思う：

//JSON validation 
function validation(username, password){ 
var alert = document.getElementById("invalid-data"); 
var parsed_data = JSON.parse(data); 

for (var i=0; i < parsed_data.length; i++) { 
    if (username == parsed_data[i].login && password == parsed_data[i].password) { 
     window.open("panel.html", "_self"); 
    } else { 
     alert.style.display = "block"; 
    } 
} 
} 
//Form validation 
function getLoginInfo() { 
var username = document.getElementById("username").value; 
var password = document.getElementById("password").value; 

validation(username, password); 
} 

var button = document.getElementById("login-button"); 
button.addEventListener("click", getLoginInfo); 

Answer 2

ので、この機能の問題は

data = JSON.parse(data); 

が関数の中にあったということでした。私はそれをグローバルにして、すべてうまく動作します。