javascriptの動作

前提・実現したいこと

ここに質問の内容を詳しく書いてください
■■な機能を実装中に以下のエラーメッセージが発生しました。
javascriptの動作が正しくされません。
何が間違ってるのでしょうか??

発生している問題・エラーメッセージ

<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>中級</title> <script> var timerid = 0; var count = 0; function element_btn() { timerid = setInterval(display,2000); } function display() { var input = document.getElementById('box'); var output = document.getElementById('disp'); count++; if(input.value.length >= count) { output.innerHTML = input.value.substr(0,count); } else { clearInterval(timerid); alert('終了'); } } window.onload = function() { var start = document.getElementById('btn'); start.addEventListener('click',element_btn,false); } </script> </head> <body> <form> <input type="text" id="box"> <button id="btn">1文字ずつ表示</button> </form> <div id="disp"></div> </body> </html> ``` エラーメッセージ ```

該当のソースコード

ソースコード

試したこと

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

m.ts10806

2020/05/06 08:44

コードやエラーはマークダウンのcode機能を利用してご提示ください。 https://teratail.com/questions/238564 質問テンプレート文言と思われるものも残っているので、要件に関係なければ削ってください。可能ならタイトルはもっと具体的に要件を記載してください。あと「動作しません」では何も分からないので、「起きたこと」を記載してください。 https://teratail.com/help/question-tips#questionTips3-4

kei344

2020/05/06 08:45

（質問文は編集できます）質問文のコードはコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。また、質問テンプレートの文字列が残ってしまっていますので、不要な部分は削除してください。あと、「正しくされません」とは「何をしたときに」「どうなると思って」「どうなったのか」を、出ているエラーなどと併せて、具体的に記述されたほうが回答を得られやすいと思います。

maisumakun

2020/05/06 08:45

「どう動かすつもり」で実装して、「実際にはどうなっている」のでしょうか。

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

回答2件

ヒントだけ。
buttonタグのデフォルトtypeはsubmit

<button>: ボタン要素

type
submit: 自身が属するフォームのデータをサーバーに送信するボタンとなります。これは type 属性が指定されていない場合、もしくは属性値が動的に空にされたり不正な値にされた場合の既定の動作です。

「どうなるつもりで組んだコードなのか」が提示されてないので、気になったところだけ。
これだけで「想定の動作をするか」は保証ありません。説明がないので。

投稿2020/05/06 08:58

編集2020/05/06 08:59

m.ts10806

総合スコア80875

chidayo

2020/05/06 23:54

テキストボックスに文字を入力しボタンをクリックすると、入力された文字が2秒ごとに先頭から1文字ずつ順番に表示されるプログラムを作成してください。 ↑↑これを出来るようにしたいです。説明文を書き忘れてしまい申し訳ありません。

m.ts10806

2020/05/07 00:03

質問は編集できます。コードのマークダウン対応も含めて調整願います。

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

ベストアンサー

とりあえず

javascript
1function element_btn(e) {
2  e.preventDefault();
3  timerid = setInterval(display,2000);
4}

投稿2020/05/07 03:41

編集2020/05/07 03:42

yambejp

総合スコア116724

yambejp

2020/05/07 03:45 編集

substrは使っちゃダメです window.onloadやinnerHTMLもあまりおすすめできません長さとカウンタをくらべていますがvalueとtextContentを比べたほうがよいでしょうそれと表示が完了してから2秒まってalertする必要はあるのでしょうか？ buttonが何度も押せるのでバグの元です

chidayo

2020/05/07 09:11

アドバイスありがとうございます。今後の参考にさせていただきます。

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

あなたの回答