ボタンが起動しません

###前提・実現したいこと
javascriptで
ドットインストールのジェネレーターを作っています。
http://dotinstall.com/lessons/pwd_generator_js_v3/37806

###発生している問題・エラーメッセージ
ボタンをクリックしてパスワードを出したいのですが、うまくいきません。

エラーメッセージ
zyenereta.html:66 Uncaught ReferenceError: seed is not defined
    at getPassword (zyenereta.html:66)
    at zyenereta.html:82
    at zyenereta.html:83

ボタン押した際
エラーメッセージ
zyenereta.html:66 Uncaught ReferenceError: seed is not defined
    at getPassword (zyenereta.html:66)
    at HTMLDivElement.<anonymous> (zyenereta.html:75)

###該当のソースコード

javascript
1<!DOCTYPE html>
2<html>
3
4<head>
5    <meta charset="UTF-8">
6    <title>じぇねれーたー</title>
7    <style>
8        body {
9            text-align: center;
10        }
11
12        .box {
13            width: 320px;
14            margin: 30px auto;
15        }
16
17        #btn {
18            color: white;
19            background-color: #5bb1dc;
20            padding: 7px;
21            border-radius: 5px;
22            box-shadow: 0 4px 0 #0088cc;
23            cursor: pointer;
24        }
25
26        #btn:hover {
27            opacity: 0.9;
28        }
29    </style>
30
31</head>
32
33<body>
34<div class="box">
35    <p><input type="text" id="result"></p>
36    <p>
37        <div id="btn">ジェネレーター</div>
38    </p>
39</div>
40
41    <fieldset>
42        <legend>オプションズ</legend>
43        <p>Lendths(
44            <span id="label">8</span>)
45            <input type="range" id="slider" value="8" min="4" max="20"></p>
46        <p>
47            Numbers<input type="checkbox"> Symbols
48            <input type="checkbox">
49        </p>
50    </fieldset>
51    <script>
52        (function() {
53            'use strict';
54
55            var slider = document.getElementById('slider');
56            var label = document.getElementById('label');
57            var btn = document.getElementById('btn');
58            var result = document.getElementById('result');
59
60            function getPassword(){
61              var send ='aatatehuawouao';
62              var len =slider.value;
63              var pwd ='';
64
65              for(var i=0; i<len; i++){
66                pwd += seed[Math.floor(Math.randam()*seed.length)];
67              }
68              result.value=pwd;
69              }
70
71            slider.addEventListener('change',function(){
72                label.innerHTML=this.value;
73            });
74            btn.addEventListener('click',function(){
75              getPassword();
76                // result.value='hfaowioaj';
77            });
78            result.addEventListener('click',function(){
79                this.select();
80            });
81
82          getPassword();
83        })();
84    </script>
85</body>
86
87</html>
88

###試したこと
エラーコードを読んで検索してみましたがわかりませんでした。
勉強中なのでわからないことだらけですがよろしお願いします・・・。

行動規範の内容に同意します

回答2件

ベストアンサー

以下のようになるのでは。
0. 変数名、seedとsendどっちかにそろえる。
0. Math.randam()ではなくて、Math.random()。

HTML
1<!DOCTYPE html>
2<html>
3
4<head>
5    <meta charset="UTF-8">
6    <title>じぇねれーたー</title>
7    <style>
8        body {
9            text-align: center;
10        }
11
12        .box {
13            width: 320px;
14            margin: 30px auto;
15        }
16
17        #btn {
18            color: white;
19            background-color: #5bb1dc;
20            padding: 7px;
21            border-radius: 5px;
22            box-shadow: 0 4px 0 #0088cc;
23            cursor: pointer;
24        }
25
26        #btn:hover {
27            opacity: 0.9;
28        }
29    </style>
30
31</head>
32
33<body>
34<div class="box">
35    <p><input type="text" id="result"></p>
36    <p>
37    <div id="btn">ジェネレーター</div>
38    </p>
39</div>
40
41<fieldset>
42    <legend>オプションズ</legend>
43    <p>Lendths(
44        <span id="label">8</span>)
45        <input type="range" id="slider" value="8" min="4" max="20"></p>
46    <p>
47        Numbers<input type="checkbox"> Symbols
48        <input type="checkbox">
49    </p>
50</fieldset>
51<script>
52    (function () {
53        'use strict';
54
55        var slider = document.getElementById('slider');
56        var label = document.getElementById('label');
57        var btn = document.getElementById('btn');
58        var result = document.getElementById('result');
59
60        function getPassword() {
61            var seed = 'aatatehuawouao';//他がseedになってるのでここはたぶんseed
62            var len = slider.value;
63            var pwd = '';
64
65            for (var i = 0; i < len; i++) {
66                pwd += seed[Math.floor(Math.random() * seed.length)];//Math.randamではなくてMath.random
67            }
68            result.value = pwd;
69        }
70
71        slider.addEventListener('change', function () {
72            label.innerHTML = this.value;
73        });
74        btn.addEventListener('click', function () {
75            getPassword();
76            // result.value='hfaowioaj';
77        });
78        result.addEventListener('click', function () {
79            this.select();
80        });
81
82        getPassword();
83    })();
84</script>
85</body>
86
87</html>

投稿2017/01/08 10:21

編集2017/01/08 10:22

s8_chu

総合スコア14731

berukokoko

2017/01/08 10:36

回答ありがとうございます。その部分を直したらエラーも消えちゃんと動きました！先に進めなくなっていたので助かりました（´・ω...:.;::..

行動規範の内容に同意します

JavaScript
1// var send ='aatatehuawouao';
2//       ↓ 打ち間違いでは？
3   var seed ='aatatehuawouao';

投稿2017/01/08 09:47

kei344

総合スコア69407

berukokoko

2017/01/08 10:34

回答ありがとうございました。おっしゃる通りで変数名が間違ってました・・・！

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう！

ボタンが起動しません

関連した質問