javascript onclickカスタムjsファイルのヌル

私は単にAリンクをクリックしてアラートボックスを表示することを検出しようとしています。スクリプトをphpファイルの中に置くと、リンクが見つかるたびに正常に動作しますが、カスタムJSファイルに置くたびにそれが検出されず、 'Uncaught TypeError：プロパティを設定できません'というエラーが表示されますonclick "null"を返します。javascript onclickカスタムjsファイルのヌル

私は以前の作業コードがページにあるので、PHPページとカスタムjsページの間のリンクは間違いなく機能しています。それは単に私のAのリンクをそれが外部のスクリプトにあるそれを検出しません。

HTML

<a id="ConfirmHolidayClose" href="#"> 
    <img src="assets/img/close-button.png" alt="Holiday-request-close-button" 
     class="CloseButton" /> 
</a>

JAVASCRIPT

document.getElementById("ConfirmHolidayClose").onclick=function(){ 
    alert("Working"); 
}

UPDATEは - 申し訳ありません言及を忘れ、私のリンクは 'ConfirmHoliday' と呼ばれるのdiv内にネストされます。

カスタムJS内のConfirmHoliday divをJSコードで操作しているため、現時点で親divが完全にうまく見つかっているため、ロードできません。

出典

2016-11-28 Anonymous

あなたは要素の前に、あなたのJSをロードしていますか？ –

ConfirmHolidayClose要素が存在する前にアクセスしようとしていますか？あなたのページはあなたのページのどこにロードされていますか？私はあなたのことを推測しています – Zinc

window.onload関数内にスクリプトを書いてください –

要素が作成される前にjavascriptファイルが実行されるため、存在しません。

1）window.onload機能

window.onload = function() { 
    // Your code here 
};

2）別のJSファイルに入れて、スクリプトタグに延期プロパティを追加して、コードを囲みます。これを解決するために、あなたはカップルのオプションがあります。

<script src="yourScript.js" defer="defer"></script>

3）それは多分存在する前にConfirmHolidayClose要素にアクセスしようとしているアンカータグ

出典

2016-11-28 11:55:10

ウィンドウ。onloadが正しくない - ページ全体がロードされるまで待機する、DOMがロードされるのを待つだけです – Zinc

@Zinc現在アンカータグでイメージをカプセル化しています。画像がロードされていない場合は、それをクリックしてください –

この場合、良い点ですが、それは別の問題です。画像の寸法を設定すると、DOMにプレースホルダが存在するため、これは問題になりません。 – Zinc

後にスクリプトタグを入れて？あなたのページはあなたのページのどこにロードされていますか？これは何のJSを保証していない、DOMレディ機能であなたのJSをラップ）

1）だけ</body>

2上のページの一番下にスクリプトを移動します：私はいくつかのソリューションは、あなたの<head>

に推測していますDOMツリーが存在するまで実行します。 jQueryの、以下の例と最も簡単には...

jQueryの例

$(function() { 

    document.getElementById("ConfirmHolidayClose").onclick=function(){ 
     alert("Working"); 
    } 

});

バニラ例

document.addEventListener("DOMContentLoaded", function() { 

    document.getElementById("ConfirmHolidayClose").onclick=function(){ 
     alert("Working"); 
    } 

});

出典

2016-11-28 11:56:33 Zinc

大文字のhtmlタグは使用しないでください。それはXHTMLに反対です –

誰もdownvoteを説明することはできますか？ – Zinc

javascript onclickカスタムjsファイルのヌル

答えて

関連する問題