前提・実現したいこと
jsファイルから、HTMLのtextareaへ入力した値を取得したい
発生している問題・エラーメッセージ
入力する前のtextareaの値が取得されてしまう エラーメッセージ:なし
該当のソースコード
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Memo</title> </head> <body> <textarea id="form" value="1" cols="50" rows=5 maxlength="15"></textarea> <input type="button" value="読込" id="btn1" /> <input type="button" value="消去" id="btn2" /> <p>メモ→ <span id="memo"></span></p> </body> </html> 'use strict'; { const btn1 = document.getElementById('btn1'); const btn2 = document.getElementById('btn2'); function load(){ btn1.addEventListener('click',()=>{ const form = document.getElementById("form").value; document.getElementById("memo").textContent = form; }); } function clearContent(){ btn2.addEventListener('click',()=>{ document.getElementById("memo").textContent = ""; }); } load(); clearContent(); }
試したこと
下記のように、HTML内にjsを書いたら入力したtextareaの値を取得できました。
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Memo</title> </head> <body> <textarea id="form" value="1" cols="50" rows=5 maxlength="15"></textarea> <input type="button" value="読込" onclick="load()"/> <input type="button" value="消去" onclick="clearContent()"/> <p>メモ→ <span id="memo"></span></p> <script> function load(){ const form = document.getElementById("form").value; document.getElementById("memo").textContent = form; } function clearContent(){ document.getElementById("memo").textContent = ""; } </script> </body> </html>補足情報(FW/ツールのバージョンなど)
JSに追加で書きたいコードがあるため、HTML内ではなく、jsファイルからtextareaの値を取得できる方法を教えていただければと思います。
色々調べてみたのですが、わからなかったため質問させて頂いております。
回答1件
あなたの回答
tips
プレビュー