javascript - 不要なときにポップアップメッセージが開くのを修正する方法がわからない

Question

HTMLとJavascriptを使用してWebサイトにログインしようとしましたが、1つの問題を除いて正常に機能します。最初のログイン情報はログインしますが、elseポップアップメッセージが表示されます！これを修正するにはどうすればよいですか？

function Login(form) 
{
    username = new Array("alex364981");
    password = new Array("Codylewis");
    page = "user2" + ".html";

    if (form.username.value == username[0] && form.password.value == password[0]
            || form.username.value == username[1] && form.password.value == password[1]
            || form.username.value == username[2] && form.password.value == password[2]
            || form.username.value == username[3] && form.password.value == password[3]
            || form.username.value == username[4] && form.password.value == password[4]
            || form.username.value == username[5] && form.password.value == password[5]
            || form.username.value == username[6] && form.password.value == password[6]
            || form.username.value == username[7] && form.password.value == password[7]
            || form.username.value == username[8] && form.password.value == password[8]
            || form.username.value == username[9] && form.password.value == password[9])
    {
        self.location.href = page;
    }

    username = new Array("test");
    password = new Array("this");
    page = "user1" + ".html";

    if (form.username.value == username[0] && form.password.value == password[0]
            || form.username.value == username[1] && form.password.value == password[1]
            || form.username.value == username[2] && form.password.value == password[2]
            || form.username.value == username[3] && form.password.value == password[3]
            || form.username.value == username[4] && form.password.value == password[4]
            || form.username.value == username[5] && form.password.value == password[5]
            || form.username.value == username[6] && form.password.value == password[6]
            || form.username.value == username[7] && form.password.value == password[7]
            || form.username.value == username[8] && form.password.value == password[8]
            || form.username.value == username[9] && form.password.value == password[9])
    {
        self.location.href = page;
    }
    else
    {
        alert("Either the Username or Password is Wrong.\nPlease try again.");
        form.username.focus();
    }
    return true;
}

Answer 1

これを試して。配列をループすると、コードがクリーンアップされ、読みやすくなります。これにより、後で拡張することも容易になります。

function Login(form) 
{
    username = new Array("alex364981");
    password = new Array("Codylewis");
    page = "user2.html";

    var numOfUsers=10;
    for(var i=0;i<numOfUsers;i++)
    {
        if (form.username.value == username[i] && form.password.value == password[i])
        {
            self.location.href = page;
            return true;
        }
    }
    //All possibilities exhausted, Show error.
    alert("Either the Username or Password is wrong.\nPlease try again.");
    return false;
}

お役に立てれば。

また、ユーザーが html のソース コードを表示し、関数からユーザー名とパスワードを直接取得できることに注意してください。PHP スクリプトまたはデータベースで非表示にすることをお勧めします。

Answer 2

else ブロックは 2 番目の if チェックにのみ適用されます

username = new Array("test");
password = new Array("this");
page = "user1" + ".html";

if (form.username.value == username[0] && form.password.value == password[0] || form.username.value == username[1] && form.password.value == password[1] || form.username.value == username[2] && form.password.value == password[2] || form.username.value == username[3] && form.password.value == password[3] || form.username.value == username[4] && form.password.value == password[4] || form.username.value == username[5] && form.password.value == password[5] || form.username.value == username[6] && form.password.value == password[6] || form.username.value == username[7] && form.password.value == password[7] || form.username.value == username[8] && form.password.value == password[8] || form.username.value == username[9] && form.password.value == password[9])

{
    self.location.href = page;
}
else {
    alert("Either the Username or Password is Wrong.\nPlease try again.");
    form.username.focus();
}

最初の if ブロックからログインが成功するはずです。

フラグを使用してログインが成功したかどうかを確認し、フラグを使用してエラー メッセージを表示する必要があります。

これを試して：

function Login(form) 
{
    flag = false;

    username = new Array("alex364981");
    password = new Array("Codylewis");
    page = "user2" + ".html";

    if (form.username.value == username[0] && form.password.value == password[0] || form.username.value == username[1] && form.password.value == password[1] || form.username.value == username[2] && form.password.value == password[2] ||  form.username.value == username[3] && form.password.value == password[3] || form.username.value == username[4] && form.password.value == password[4] || form.username.value == username[5] && form.password.value == password[5] || form.username.value == username[6] && form.password.value == password[6] || form.username.value == username[7] && form.password.value == password[7] || form.username.value == username[8] && form.password.value == password[8] || form.username.value == username[9] && form.password.value == password[9])

    {
        self.location.href = page;
        flag = true;
    }

    username = new Array("test");
    password = new Array("this");
    page = "user1" + ".html";

    if (form.username.value == username[0] && form.password.value == password[0] || form.username.value == username[1] && form.password.value == password[1] || form.username.value == username[2] && form.password.value == password[2] || form.username.value == username[3] && form.password.value == password[3] || form.username.value == username[4] && form.password.value == password[4] || form.username.value == username[5] && form.password.value == password[5] || form.username.value == username[6] && form.password.value == password[6] || form.username.value == username[7] && form.password.value == password[7] || form.username.value == username[8] && form.password.value == password[8] || form.username.value == username[9] && form.password.value == password[9])

    {
        self.location.href = page;
        flag = true;
    }

    if(!flag) {
        alert("Either the Username or Password is Wrong.\nPlease try again.");
        form.username.focus();
    }
    return true;
}