assignment Boards -
JavaScriptの質問をしたり答えたりする掲示板
2020-06-16に更新
textboxに文字を入力し、検索ボタンを押すと入力した文字がdocument部分に出力されるプログラムを作成しています。作成した以下のコードをブラウザ上で確認すると、コンソールにエラーが表示されます。
エラーの解消方法を教えてください。使用しているブラウザはClomeです。
発生するエラー
Uncaught TypeError: Cannot read property 'word' of null
at HTMLFormElement.document.getElementById.onsubmit
ーーーーーーーーーーーーーーーーー
作成したコード
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<title>template</title>
<link href="../../_common/css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<header>
<div class="header-contents">
<h1>タイトル</h1>
<h2>サブタイトル</h2>
</div><!-- /.header-contents -->
</header>
<div class="main-wrapper">
<section>
<form action="#" id="form">
<input type="text" name="word">
<input type="submit" value="検索">
</form>
<p id="output"></p>
</section>
</div><!-- /.main-wrapper -->
<footer>JavaScript Samples</footer>
<script>
'use strict';
document.getElementById('form').onsubmit=function(event){
event.preventDefault();
const search= document.getElementById('from').word.value;
document.getElementById('output').textContent=`「${search}」の検索中...`;
};
</script>
</body>
</html>
assignment Boards -
JavaScriptの質問をしたり答えたりする掲示板
コメント
assignment Boards -
JavaScriptの質問をしたり答えたりする掲示板