AT's Blog

趣味のプログラミング、ギター、音楽とかとか

関数名が原因でボタンを押しても関数が実行されなかった件

JavaScript HTML プログラミング

JavaScriptを勉強していて、遭遇したトラブル事例です。

下記コードを実行すると、Button2ではメッセージが表示されますが、Button1では表示されません。 予約語の問題かと思いましたが、それならclick_()もメッセージを表示できないはず…。

ちなみに環境は、

  • OS : OS X Yosemite Ver. 10.10.5
  • ブラウザ : Chrome 60.0.3112.101（Official Build) (64bit)

です。

<!DOCTYPE html>
<html>
<head>
    <title>
        Button Test
    </title>
</head>
<body>
    <input id="button1" type="button" value="Button1" onclick="click();" />
    <input id="button2" type="button" value="Button2" onclick="click_();" />
    <div id="out"></div>

    <script type="text/javascript">
        function click() { document.getElementById('out').innerHTML = "Hello!"; }
        function click_() { click(); }
    </script>
</body>
</html>

HTML+JSの名前空間（？）に対する理解が足りない私は、とりあえず関数名に気をつけようと思った次第でした。