javascript - Pro Javascript のコードが実行されない

Question

ここでの意向という言葉は適切ではないと思います。実行できません。

これは非常に単純なコードです。入力するだけでalert("Working");問題なく動作します。

いずれにせよ、ここにコード全体があり、私が間違っていることを理解するのを手伝ってくれるかもしれません.

<!DOCTYPE html>
<html>
<head>
    <title>Events</title>
</head>
<body>
<script type="text/javascript">
    var btn = document.getElementById("btn");
    btn.attachEvent("onclick", function(){
        alert("Clicked");
    })

</script>
<input id="btn" type="button" value="Press me">
</body>
</html>

score 3 · Accepted Answer

いくつかの問題:

ドキュメントがロードされるまで、コードは実行できません。実行が早すぎると、ページ内のオブジェクトがまだ見つかりません。</body>これを行う最も簡単な方法は、コードブロックをタグの直前に移動することです。
attachEvent()古いバージョンの IE 専用です。最新のブラウザはすべて.addEventListener().

改訂された HTML/コード:

<!DOCTYPE html>
<html>
<head>
    <title>Events</title>
</head>
<body>
<input id="btn" type="button" value="Press me">
<script type="text/javascript">
    var btn = document.getElementById("btn");
    btn.addEventListener("click", function(){
        alert("Clicked");
    })

</script>
</body>
</html>

実際のデモ: http://jsfiddle.net/jfriend00/Dmqdn/

score 0 · Accepted Answer

これを FF (およびその他の最新のブラウザー) で機能させるには:

document.addEventListener("DOMContentLoaded", function(event) {
    var btn = document.getElementById('btn');
    btn.addEventListener('click', function() {
        console.log('Clicked');
    });
});

DOM にアクセスする前に、DOM が完全に読み込まれていることを確認するのが最も安全です。

私はを使っconsole.logたことがあります。慣れる必要があります。大いに役立つでしょう。Chrome の開発ツールである FF の FireBug をチェックしてください。

score 0 · Accepted Answer

これが解決策を示すjsfiddleです。これを機能させるには、次の 2 つのことを行う必要があります。

<script>タグを入力の下に移動します
に置き換えattachEventますaddEventListener。attachEventはサポートされなくなりました

コードは次のとおりです。

<input id="btn" type="button" value="Press me">

<script type="text/javascript">
    var btn = document.getElementById("btn");
    btn.addEventListener("click", function(){
        alert("Clicked");
    })
</script>

javascript - Pro Javascript のコードが実行されない

3 に答える 3

Related

Reference