jqueryでログインする

Question

作成したアカウントにサインアップしてログインできるウェブサイトを作ろうとしています。ユーザー名とパスワードをデータベースなどに保存したくありません。学校のプロジェクト）は重要ではないので、できるだけローカルストレージを使ってアカウントを保存してログインできるようにしたい：

1：どのようにすればアカウントを作成できますか？ localstorageを通じて保存されます。

2：どのように私はそれは彼らが間違っている場合

は、私はjQueryのでこれをどのように行うのか、ユーザー名とパスワードが正しいの方はログインしてください、と反対の操作を行い作るのですか？前もって感謝します！

HTML：

<div id="log-in-modal"> 
    <div class="modal-content"> 
     <span class="close" id="close-log-in">x</span> 
     <p><label>Username</label><input type="text" id="username"></p> 
     <p><label>Password</label><input type="password" id="password"></p> 
     <input type="submit" value="Log In" id="submit"> 
    </div> 
</div> 

<div id="sign-up-modal"> 
    <div class="modal-content"> 
     <span class="close" id="close-sign-up">x</span> 
     <p><label>Username</label><input type="text" id="sign-username"></p> 
     <p><label>Password</label><input type="password" id="sign-password"></p> 
     <input type="submit" value="Sign Up" id="sign-submit"> 
    </div> 
</div> 

これらは、ユーザー名とパスワードのテキストフィールドを持つモーダルている、私は、「ログイン」ボタンまたはウェブサイトのメニューのボタンを「サインアップ」をクリックしてモーダルを開きます。サインアップ作成：ステップ2が

if(localStorage['usernames'] && localStorage['passwords']) { // see if they exist yet 
    // code to execute if the arrays already exist 
} else { 
    var usernames = []; 
    var passwords = []; // create two empty arrays if nothing is in Local Storage 
} 

が存在しない場合、ユーザ名/パスワードの配列を作成します。

ステップ1：

Answer 1

あなたはそれらから/プルローカルストレージに2つの配列を格納し、プッシュすることができ機能

function signUp(signUpUsername, signUpPassword) { 
    usernames.push(signUpUsername); // adds username to the end of array 
    passwords.push(signUpPassword); // " password " " " " " 
} 

は、ステップ3：ログイン機能を作成

function logIn(loginUsername, loginPassword) { 
    var cu = localStorage['usernames']; // correct usernames 
    var cp = localStorage['passwords']; // correct passwords 

この例では、セキュリティを無視し、ブラウザに直接保存され、ローカルストレージを使用しています！資格情報は注意

for(var i = 0; i < cu.length; i++) { 
     if(cu[i] == loginUsername && cp[i] == loginPassword) { 
      // you have been logged in! 
     } else { 
      // incorrect credentials (display message!) 
     } 
    } 
} 

正しいかどうかを確認するために、アレイを通して

ゴー誰かがデータを盗む場合に備えて、データが貴重ではないことを確認してください。