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

我不知道当我单击submit按钮时，以及在复选框中勾选off和on复选框时，如何使事件侦听器工作。有人能看一下我的代码，用香草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);

var小写=[“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”]；
变量大写=[“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”]；
变量数=[“0”、“1”、“2”、“3”、“4”、“5”、“6”、“7”、“8”]；
变量符号=[“！”、“@”、“#”、“$”、“%”、“^”、“&”、“*”]；
var passwordLength=document.getElementById（“长度”）；
var submitlet=document.getElementById（“提交”）；
var textDisplayElt=document.getElementById（“显示”）；
submitlet.addEventListener（“单击”，函数（）{
})
函数生成器密码（密码长度）{
var password=“”；
对于（变量i=0；i

这应该可以做到

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;
}

var小写=[“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”]；
变量大写=[“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”]；
变量数=[“0”、“1”、“2”、“3”、“4”、“5”、“6”、“7”、“8”]；
变量符号=[“！”、“@”、“#”、“$”、“%”、“^”、“&”、“*”]；
document.getElementById（“提交”）.addEventListener（“单击”，函数）（）{
var passwordLength=Number（document.getElementById（“length”）.value.replace（/\D/g，”））；
document.getElementById（“display”）.innerHTML=generatePassword（密码长度）；
});
函数生成器密码（密码长度）{
var password=“”；
for（var i=0；i

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

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

生成密码

不久前，我创建了一个小提琴，因为我有点厌倦了每次生成新的键进行测试。这是实现这一目标的途径

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

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

---

我已经回答了下面的问题，但请注意，当您关闭for循环时，不必使用分号