0

現象
「適正体重を表示」ボタンを押しても、alertが表示されない。

期待値
index.htmlの「適正体重を表示」ボタンを押したら、alertが表示される。

再現手順
下のHTMLで記述されたファイルとJavaScriptで記述されたファイルを、同じディレクトリで実行する。

index.html

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>formに身長を入力すると、適正体重がダイアログに表示される</title>
</head>
<body>
    <h3>formに身長を入力すると、適正体重が表示ダイアログに表示されます</h3>
    <form>
        <input id="height" name="height" type="number" />
        <input id="btn" type="button" value="適正体重を表示" />
    </form>
   <script src="dialog.js"></script> 
</body>
</html>

dialog.js

document.addEventListener('DOMContentLoaded', function() {
    document.getElementById('btn').addEvemtListener('click', function() {
        var height = document.getElementById('height');
        var appropriateWeight = new Function('height', 'return height ** 2 * 22;');
        window.alert('適正体重:' + appropriateWeight(height) + 'kg');
    });
});
3
  • 1
    document.getElementById('btn').addEvemtListener でスペルミスがあります。
    – metropolis
    Commented 2021年9月11日 11:31
  • 1
    関数やメソッドの名前に関して、modern な IDE(例えば Visual Studio Code など)であれば completion(入力補完)機能が働いて自動的に挿入してくれますし、signature やドキュメントなども表示されます。綴りの間違いで時間を割かれることも無くなるかと思いますので IDE などの利用をお勧めします。
    – metropolis
    Commented 2021年9月12日 1:34
  • 1
    余計なことですが、綴りの間違いを直して alert が表示される様になったとしても表示される内容(適正体重)は期待しているものとは異なるものになるでしょう。
    – metropolis
    Commented 2021年9月12日 1:42

1 件の回答 1

1
document.getElementById('btn').addEvemtListener('click', function() {
                                  ^^^^^

この部分を打ち間違えています。

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。