為什么我的密碼生成器在我點擊按鈕之前顯示密碼？-有解無憂

該函式生成，但每次重繪瀏覽器時都會生成，我試圖使每次單擊按鈕時都會出現該字串，然后生成一個新字串。任何幫助，將不勝感激！！

    <body>
  <button type="button" onclick="generatePassword()">GENERATE</button>
  <p id="demo"></p>

<script>

function generatePassword(length = 12) {
    let generatedPassword = "";

    const validChars = "0123456789"  
        "abcdefghijklmnopqrstuvwxyz"  
        "ABCDEFGHIJKLMNOPQRSTUVWXYZ"  
        ",.-{} !\"#$%/()=?";

    for (let i = 0; i < length; i  ) {
        let randomNumber = crypto.getRandomValues(new Uint32Array(1))[0];
        randomNumber = randomNumber / 0x100000000;
        randomNumber = Math.floor(randomNumber * validChars.length);

        generatedPassword  = validChars[randomNumber];
    }

    return generatedPassword;

  }

  document.getElementById("demo").innerHTML = generatePassword();


</script>

</body>

uj5u.com熱心網友回復：

因為您正在呼叫generatePassword代碼本身。改用這個

    <body>
  <button type="button" onclick="generatePassword()">GENERATE</button>
  <p id="demo"></p>

<script>

function generatePassword(length = 12) {
    let generatedPassword = "";

    const validChars = "0123456789"  
        "abcdefghijklmnopqrstuvwxyz"  
        "ABCDEFGHIJKLMNOPQRSTUVWXYZ"  
        ",.-{} !\"#$%/()=?";

    for (let i = 0; i < length; i  ) {
        let randomNumber = crypto.getRandomValues(new Uint32Array(1))[0];
        randomNumber = randomNumber / 0x100000000;
        randomNumber = Math.floor(randomNumber * validChars.length);

        generatedPassword  = validChars[randomNumber];
    }

    document.getElementById("demo").innerHTML = generatedPassword;
  }
</script>

</body>

或者甚至更好，不要onclick="..."在元素本身上說：

    <body>
  <button type="button" id="generateButton">GENERATE</button>
  <p id="demo"></p>

<script>

function generatePassword(length = 12) {
    let generatedPassword = "";

    const validChars = "0123456789"  
        "abcdefghijklmnopqrstuvwxyz"  
        "ABCDEFGHIJKLMNOPQRSTUVWXYZ"  
        ",.-{} !\"#$%/()=?";

    for (let i = 0; i < length; i  ) {
        let randomNumber = crypto.getRandomValues(new Uint32Array(1))[0];
        randomNumber = randomNumber / 0x100000000;
        randomNumber = Math.floor(randomNumber * validChars.length);

        generatedPassword  = validChars[randomNumber];
    }

    return generatedPassword;
  }

  document.getElementById("generateButton").addEventListener("click", () => document.getElementById("demo").textContent = generatePassword());

</script>

</body>

轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/379593.html

標籤：javascript html

上一篇：根據列將大型csv檔案拆分為多個檔案

下一篇：替換腳本標簽型別并應用它