2016-10-10 11 views
0

私はaddEventListener()関数の周りに頭を浮かべて、ローカルホストにいくつかのコードをインストールしようとしていますが、コードを実行するとエラーメッセージが表示されます:Uncaught TypeError:section2 .addEventListenerは関数ではありません。addEventListenerエラーをスローする

以下のコードは、基本的にsection2が読み込まれる(ビデオコンテンツを保持する)場合、section1(プリローダーを含む)を消してほしいです。コードの容易さのために、変数にjQueryを使用しています。私は変数が実際のサイトに表示されていることをテストするためにconsole.logを使用しました。

var section1 = $("#section1"), 
    section2 = $("#section2"); 


section2.addEventListener("load", function(){ 

    section1.style.display="none"; 

}) 

なぜ機能していないのですか?

+2

'addEventListener'は' HTMLElement's、_not_ jQueryのオブジェクトのような 'EventTarget'オブジェクト、上の関数です。 – Xufox

+0

jQueryの[on()](http://api.jquery.com/on/)を参照してください: "選択した要素に1つまたは複数のイベントのイベントハンドラ関数をアタッチします。" – showdev

+0

ありがとうございます。それはコンソールでエラーを停止しました。セクション2がロードされても、セクション1は実際には消えませんか? –

答えて

2

Xufoxはあなたの投稿の直下にあります。オブジェクトではなく、jQueryは$( '...')で選択します。

オプションA)の純粋なJavascriptを:

var section1 = document.getElementById('section1'), 
    section2 = document.getElementById('section2'); 

オプションB)のjQuery:

section2.on("load", function(){ 
    section1.hide(); 
}) 
+0

それはコンソールでエラーを停止しました。セクション2がロードされても、セクション1は実際には消えませんか? –

+0

@EmilyChewy別問題です。 'load'はイメージやiframeのような特定のタイプの要素に対してのみ機能します。あなたが知っているものは、物事をロードするものです。 –

+0

ああそうです。申し訳ありませんが、私はJSの新人です。私は行かなければならず、それがどのような要素で作用しているかを調べなければならないでしょうJSプレローダーをどうやって行うのかについては、少し犠牲になっています。私はそれをに追加し、ボディーや何かに負荷をかける必要があると思いますか? –