パスワード ジェネレーター を JavaScript で作成

アプリ

パスワードジェネレーター

パスワードジェネレーター





プログラム

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>パスワードジェネレーター</title>
    <script>
        function generatePassword() {
            const length = document.getElementById('length').value;
            const includeLetters = document.getElementById('letters').checked;
            const includeNumbers = document.getElementById('numbers').checked;
            const includeSymbols = document.getElementById('symbols').checked;

            let characters = '';
            if (includeLetters) characters += 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
            if (includeNumbers) characters += '0123456789';
            if (includeSymbols) characters += '!@#$%^&*()_+~`|}{[]:;?><,./-=';

            let password = '';
            for (let i = 0; i < length; i++) {
                const randomIndex = Math.floor(Math.random() * characters.length);
                password += characters[randomIndex];
            }

            document.getElementById('password').innerText = password;
        }

        function copyPassword() {
            const password = document.getElementById('password').innerText;
            navigator.clipboard.writeText(password).then(() => {
                alert('パスワードがコピーされました！');
            }, (err) => {
                alert('パスワードのコピーに失敗しました。');
            });
        }
    </script>
</head>
<body>
    <h1>パスワードジェネレーター</h1>
    <label for="length">パスワードの長さ:</label>
    <input type="number" id="length" min="1" value="12">
    <br>
    <label for="letters">アルファベットを含む:</label>
    <input type="checkbox" id="letters" checked>
    <br>
    <label for="numbers">数字を含む:</label>
    <input type="checkbox" id="numbers" checked>
    <br>
    <label for="symbols">記号を含む:</label>
    <input type="checkbox" id="symbols" checked>
    <br>
    <button onclick="generatePassword()">パスワード生成</button>
    <button onclick="copyPassword()">パスワードをコピー</button>
    <p id="password"></p>
</body>
</html>

JavaScript

Posted by eightban