Javascript：從數組獲取索引值

我需要創建一個簡單的用戶登錄腳本。當頁面加載提示時彈出詢問用戶名稱。如果輸入正確的用戶名，則會顯示另一個提示，要求輸入密碼。

如果用戶名和有效，那麼你一個成功的消息，否則你會得到一個失敗的消息。

我寫了所有的代碼，但在驗證用戶名和密碼時遇到了問題。你可以在我的代碼中看到我正在使用兩個數組列表。一個用於用戶，另一個用於密碼。當我運行我的代碼時，如果我爲user1鍵入正確的用戶名和密碼，它會驗證，但如果我輸入user1和user2的密碼，它仍然有效。

<script type="text/javascript"> 
//Input from user 
    var userId = prompt("Enter UserID", ""); 
     userId_lowercase = userId.toLowerCase(); 


//Username and Password Arrays 
    var userIdList = new Array(); 
     userIdList[0] = "user1"; 
     userIdList[1] = "user2"; 
     userIdList[2] = "user3"; 

    var passwordList = new Array(); 
     passwordList[0] = "pass1"; 
     passwordList[1] = "pass2"; 
     passwordList[2] = "pass3"; 

//Process input and check for authentication 

    //Check for correct userId 

     var userIdFound; 

     for (index in userIdList) 
     { 
      if (userId_lowercase == userIdList[index]) 
      { 
       userIdFound = "Y"; 
       break; 
      } 
     } 

     if (userIdFound == "Y") 
     { 
      document.write("<p>" + userId + " was Found</p>"); ; 
      //Check for correct Password 
      var password = prompt("Enter Password", ""); 
      var passwordFound; 

      for (index in passwordList) 
      { 
       if (password == passwordList[index]) // This is where I need help, 
                // how do I say 
                // "if password is from the passwordList && it matches the userId index selected" 

       { 
        passwordFound = "Y"; 
        break; 
       } 
      } 

      if (passwordFound == "Y") 
      { 
       document.write("<p>Welcome to the class!</p>"); 
      } 
      else 
      { 
       document.write("<p>Error: Password is not valid.</p>"); 
      }//END Password Check 

     } 
     else 

     { 
      document.write("<p>" + userId + " was NOT found</p>"); 
     }//END USERID Check 

</script>

來源

2010-02-12 NoDinero

登錄形式很容易被欺騙。「功課」讓你感覺如此不切實際，這真讓人遺憾。 –

@NSfY：順便說一句，謝謝你讓我們知道這是一個家庭作業問題。實際上沒有人這樣做。 – outis

首先，我不會使用for-in，我會使用一個簡單的for循環遍歷數組。然後，你可以存儲相匹配的用戶名稱，將其比作密碼數組索引：

var index; 
var userIndex; 
for (index = 0; index < userIdList.length; index++) { 
      if (userId_lowercase == userIdList[index]) 
      { 
       userIndex = index; 
       userIdFound = "Y"; 
       break; 
      } 
}

然後，在您的密碼循環，你會說：

if (password == passwordList[index] && index == userIndex) 
{ 
    passwordFound = "Y"; 
    break; 
}

這就是圍繞着簡單的方法問題。我不知道你有多少學，但你也可以使用對象的數組：通過數組

var userLogins = [{user:"user1", password:"pass1"},...etc];

然後循環詢問用戶名和密碼，看到後，一旦它們是否匹配：

for (index = 0; index < userLogins.length; index++) { 
    if (userLogins.user == userId_lowercase && userLogins.password == password) { 
     //Do stuff here 
    } 
}

需要記住的是，您必須以某種方式將用戶名連接到密碼。你目前這樣做的方式是通過兩個數組中的索引，但這並不能保證。以某種方式鏈接兩位信息會更好，如上面的對象數組。

來源

2010-02-12 22:31:06 Bob

我非常感謝您傳授您的知識。這幫助了一大堆。我一直有循環問題。在這些項目上工作真的幫助我理解他們。我同意很多人提到過使用Javascript來驗證用戶身份。但是這個項目幫助我理解了如何處理數組和循環。再次，你們搖滾！順便說一句 - StackoverFlow社區是最好的！ – NoDinero

而不是使用數組，使用對象作爲關聯數組：

var Users = { 
    root: 'god', 
    fred: 'derf', 
    luser: 'password' 
}; 

// you can access object properties using dot syntax: 
User.root 
// or using array syntax with a string as index 
User['root']; 
// when the name is stored in a variable, array syntax is the only option 
var name='root'; 
User[name];

這是一件好事，這是家庭作業，否則我將不得不與cluefulness的板揍你由於固有的不安全。

您還應該考慮使用DOM API而不是陳舊的document.write。

<script type="text/javascript"> 
    ... 
    function reportLogin(msg) { 
    var loginMsg = document.getElementById('LoginMsg'); 
    if (loginMsg.firstChild) { 
     loginMsg.firstChild.nodeValue=msg; 
    } else { 
     loginMsg.appendChild(document.createTextNode(msg)) 
    } 
    } 
</script> 
... 
<p id="LoginMsg"></p>

或

<script type="text/javascript"> 
    ... 
    function reportLogin(msg) { 
    document.getElementById('LoginMsg').firstChild.nodeValue=msg; 
    } 
</script> 
... 
<p id="LoginMsg"> </p>

（注意#LoginMsg的空間。）

來源

2010-02-12 22:22:40 outis

您需要覈對密碼的用戶名的索引。一旦你有用戶名保存索引到變量說indexOfUserName並檢查該索引對您的密碼數組。因此，而不是如果（密碼== passwordList [指數]）檢查，如果（密碼== passwordList [indexOfUserName]）

來源

2010-02-12 22:23:27

這裏是我會用一個哈希表（關聯數組）

var users = { 
user1:"pass1", 
user2:"pass2", 
user3:"pass3" 
};

現在你可以這樣測試：

function checkValidUser(userId, userPwd) { 
    return (users[userId] == userPwd); 
}

很簡單。

來源

2010-02-12 22:24:24 Robusto

不要放棄太多，考慮到這是作業。 – outis

這個想法沒問題，但是如果用戶輸入一個不正確的名稱並取消密碼對話框，那麼最終會出現'undefined == null'，這是真的。有幾個簡單的修復，但使用JavaScript這並不是真的很安全。 –

是的，馬特，你可以使用===運算符來解決這個問題。無論如何，Crockett建議您始終使用。我也開始講授關於使用Javascript進行驗證的密碼的不安全性，但畢竟這是作業，所以我認爲它不會是真實的場景。 – Robusto

如果你想使你的老師感到遺憾她的問題，這裏有一個特殊的版本：搭載的Javascript

var users = { user1:true, user2:true, user3:true }, 
     pwds = {user1:'pw1', user2:'pw2', user3:'pw3'}; 

    function theUser(userId){ 
     return { 
      hasThePassword:function(pwd){ 
       return users[userId] && pwds[userId] === pwd; 
      } 
     }; 
    } 
    if(theUser(prompt('Enter UserID', '')).hasThePassword(prompt('Enter Password', ''))){ 
     alert('user ok'); 
    }else{ 
     alert('wrong user or password'); 
    };

;-)

來源

2010-02-12 23:12:14 Mic

Javascript：從數組獲取索引值

回答

相關問題