我正在使用javascript制作密码生成器密码生成后不显示

问题描述

到目前为止，我一直在使用console.log（）来确保我的代码在每个步骤中都可以正常工作，但是密码并没有像生成密码后那样在文本区域中显示。任何帮助都会很棒。

//javascript
var generateBtn = document.querySelector("#generate");

var specialCharacters = [
  '@','%','+','\\','/',"'",'!','#','$','^','?',':',',')','(','}','{',']','[','~','-','_','.'
];

var upperCasedCharacters = [
  '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 lowerCasedCharacters = [
  '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 numericCharacters = ['0','1','2','3','4','5','6','7','8','9'];

var selectedCharacters = [];


// Write password to the #password input
function writePassword() {
  var password = generatePassword();
  var passwordText = document.querySelector("#password");
 
  passwordText.value = password;

  //prompt for password length
  var passwordLength = prompt("Select a password length between 8 and 128");
        
      //logic to ensure correct length selected
    if (passwordLength >=8 && passwordLength <=128) {

        console.log(passwordLength);

此控制台日志非常明显，只是为了确保已读取该值


          //prompts for selecting character type
        var LC = confirm("Use Lower case characters?");
        var UC = confirm("Use Upper case characters?");
        var N = confirm("Use Numeric characters?");
        var SC = confirm("Use Special characters?");

            //code to make sure a character is selected
          if (LC == true || UC == true || N == true || SC == true){

              if (LC == true) {
                selectedCharacters += lowerCasedCharacters;
              }

              if (UC == true) {
                selectedCharacters += upperCasedCharacters;
              }

              if (N == true) {
                selectedCharacters += numericCharacters;
              }

              if (SC == true) {
                selectedCharacters += specialCharacters;
              }
            
            console.log(selectedCharacters);

此控制台日志显示selectedChars数组的内容，以确认用户选择已正确更新

            generatePassword(passwordLength);

          }
        
          else {
            alert("Please select at least one character type");
          }
          
    } 
        
        //error message if incorrect values entered
    else {
      alert("Please enter a value between 8 and 128");
    }
}

function generatePassword(length) {
  var result           = '';
  var characters       = selectedCharacters;
  var charactersLength = characters.length;
  for ( var i = 0; i < length; i++ ) {
     result += characters.charat(Math.floor(Math.random() * charactersLength));
  }
  console.log(result);
  return result;
}       

// Add event listener to generate button
generateBtn.addEventListener("click",writePassword);

这时，我让控制台日志按预期从创建的数组中返回了随机字符序列，但它们没有被发布到文本区域中

解决方法

您永远不会将文本字段的值设置为生成的密码。假设您使用的是jQuery，并且您的文本字段ID为“ passwd”，则可以执行以下操作：

$("#passwd").val(generatePassword(passwordLength));

或者，如果您想使用javascript，可以使用：

document.getElementById("passwd").value = generatePassword(passwordLength);

append javascript passwords textarea