使用JavaScript点击后如何再次重置随机生成的数字？答案

【问题标题】：How to reset a randomly generated number again after a click using JavaScript?使用JavaScript点击后如何再次重置随机生成的数字？
【发布时间】：2021-09-29 10:16:02
【问题描述】：

所以，基本上，我试图在单击按钮时生成密码。该程序生成一次密码，但是当我再次单击它时，由于未生成新的随机数，该程序不会提供新密码。这是代码：

    let password  = ["NyiNE7!38vs","SyiMA4*78dt","SuoSO6]40db","LeaDU9'11ln","QooGU9!09nk","SeuXI1_63sp","SieKY6)07zk","GaaDI9'30gn","BoyLY4|74ct","BuaZI0+69vl"]
  function Random() {
let i = Math.floor(Math.random() * 9)
}
 i = Math.floor(Math.random() * 9)
const div = document.getElementById('password')
const button = document.getElementById('generate')
button.addEventListener('click' , generatePassword , Random)
function generatePassword(){
div.innerHTML = password[i]
}

【问题讨论】：

generatePassword 函数仅根据您的密码列表和 i 更新 div。 i 是在函数之外生成的。
从技术上讲，您的代码并不是一个生成器。而是选择随机密码。如果超过十个用户使用它，他们可能会共享相同的密码。相反，您可以生成更大的数字并将它们编码为 ASCII（65 为 A，66 为 B，等等）。然后，您可以对密码中的任意多个字符重复该算法。

标签： javascript button random onclick click

【解决方案1】：

这里发生了很多事情，但有一些基本错误。

我已经修复了这些错误，以便它在首次运行时创建密码，然后在您单击生成按钮时创建密码。

let password  = ["NyiNE7!38vs","SyiMA4*78dt","SuoSO6]40db","LeaDU9'11ln","QooGU9!09nk","SeuXI1_63sp","SieKY6)07zk","GaaDI9'30gn","BoyLY4|74ct","BuaZI0+69vl"]
// returns a random numbr;
function Random() {
   let i = Math.floor(Math.random() * 9)
   return i; // note i return the random number!
}
// returns a new password using Random()
function newPw(){
    return password[Random()];
}

const div = document.getElementById('password')
const button = document.getElementById('generate')
button.addEventListener('click' , generatePassword)
// if you want a pre-populated password;
generatePassword();

// Sets a new random password
function generatePassword(){
   div.innerHTML = newPw();
}

我已将其缩短以使用更安全的密码生成方法，您可以在 SO 上找到大量随机密码生成器示例。

const div = document.getElementById('password')
const button = document.getElementById('generate')
button.addEventListener('click' , generatePassword);
// if you want a pre-populated password;
generatePassword();
// taken from https://stackoverflow.com/questions/9719570/generate-random-password-string-with-requirements-in-javascript
function generatePassword(){
    var randPassword = Array(10).fill("0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz").map(function(x) { return x[Math.floor(Math.random() * x.length)] }).join('');var randPassword = Array(10).fill("0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz").map(function(x) { return x[Math.floor(Math.random() * x.length)] }).join('');
    div.innerHTML = randPassword;
}

【讨论】：

【解决方案2】：

您的代码有一些问题，首先变量 i 在 generatePassword 方法之外，因此没有得到更新。我对您的代码进行了一些更改以使其正常工作，基本上调用generatePassword onclick 并在其中调用您的随机函数。您只想在需要时以有序的方式调用函数。在下面找到代码：

  let password  = ["NyiNE7!38vs","SyiMA4*78dt","SuoSO6]40db","LeaDU9'11ln","QooGU9!09nk","SeuXI1_63sp","SieKY6)07zk","GaaDI9'30gn","BoyLY4|74ct","BuaZI0+69vl"]
  function getRandom() {
    return Math.floor(Math.random() * 9)
}
 const div = document.getElementById('password')
 const button = document.getElementById('generate')

function generatePassword(){
    const randomIndex = getRandom()
    div.innerHTML = password[i]
}


 button.addEventListener('click' , generatePassword)

此外，正如评论中所指出的，您不希望密码列表的长度有限，而是每次都生成新密码。

【讨论】：

我知道密码不应该是有限长度，但这只是一个项目