我正在创建一个密码生成器并且在 javascript 上遇到了一些问题答案

【问题标题】：Im creating a password generator and having some trouble on javascript我正在创建一个密码生成器并且在 javascript 上遇到了一些问题
【发布时间】：2019-12-05 02:08:32
【问题描述】：

我不确定当我单击提交按钮以及选中复选框时如何让事件侦听器工作。有人可以看看我的代码并使用香草javascript分解事情我对此完全陌生。这是我到目前为止得到的：

var lowercase = ["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"];
var uppercase = ["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];
var numbers = ["0","1","2","3","4","5","6","7","8"];
var symbols = ["!","@","#","$","%","^","&","*"];
var passwordLength = document.getElementById("length");
var submitElt = document.getElementById("submit");
var textDisplayElt = document.getElementById("display");


submitElt.addEventListener("click",function () {

})




function generatePassword(passwordLength) {

   var password = "";
   for(var i = 0; i < passwordLength; ++i){
    var length = lowercase.length;
    var lowerLetters = Math.floor(Math.random() * length);
    var lower = lowercase[lowerLetters];
    password = password + lower; 
   };

   for(var i = 0; i < passwordLength; ++i){
      var length = uppercase.length;
      var upperLetters = Math.floor(Math.random() * length);
      var upper = uppercase[upperLetters];
      password = password + upper; 
     };

     for(var i = 0; i < passwordLength; ++i){
      var length = numbers.length;
      var randomNumbers = Math.floor(Math.random() * length);
      var nums = numbers[randomNumbers];
      password = password + nums; 
     };

     for(var i = 0; i < passwordLength; ++i){
      var length = symbols.length;
      var symbolsGen = Math.floor(Math.random() * length);
      var sym = symbols[symbolsGen];
      password = password + sym; 
     } 



   return password

}

var passwordLength = 20;
var password = generatePassword(passwordLength);

【问题讨论】：

我已经在下面回答了，但请注意，关闭 for 循环时不必输入分号

标签： javascript passwords

【解决方案1】：

这应该可以解决问题

var lowercase = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"];
var uppercase = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"];
var numbers = ["0", "1", "2", "3", "4", "5", "6", "7", "8"];
var symbols = ["!", "@", "#", "$", "%", "^", "&", "*"];

document.getElementById("submit").addEventListener("click", function(){
    var passwordLength = Number(document.getElementById("length").value.replace(/\D/g, ""));
    document.getElementById("display").innerHTML = generatePassword(passwordLength);
});

function generatePassword(passwordLength){
    var password = "";
    for(var i = 0; i < passwordLength; i++){
        var random = Math.random();

        if(random < .25){
            password += lowercase[Math.floor(Math.random() * lowercase.length)];
        }
        else if(random < .5){
            password += uppercase[Math.floor(Math.random() * uppercase.length)];
        }
        else if(random < .75){
            password += numbers[Math.floor(Math.random() * numbers.length)];
        }
        else{
            password += symbols[Math.floor(Math.random() * symbols.length)];
        }
    }

    return password;
}

只要你的 HTML 元素看起来像这样：

<input type="number" id="length"/>
<button id="submit">Generate Password</button>
<div id="display"></div>

【讨论】：

【解决方案2】：

不久前创建了一个小提琴，因为每次生成新密钥进行测试我有点厌倦。这是https://jsfiddle.net/vikasbhandari2/48bzhpmw/47/的路径

或者，您可以使用以下干净技巧来生成随机字符串。这是一种非常有效的生成随机字符串的方法，我在 prod 中大量使用它。

(new Date().getTime() + Math.floor(Math.random() * 100000)).toString(36)

【讨论】：