jqueryイベントトリガーが動作しない

Question

私は2つのスクリプトを持っています。

最初のスクリプトはゲームのプロトタイプクラスを保持します。このクラスは厳密に使用されており、ドキュメントの準備ができていません。トリガー：また、厳格な使用がある2番目のスクリプトでは、

$("#trigger").trigger("noPossibilities"); 

は、私はトリガーをキャッチしよう：

$(document).ready(function() { 
    $("#trigger").on("noPossibilities", function() { 
     console.log("noPossibilities trigger"); 
    }); 
}); 

問題は、私はトリガーをキャッチすることができないということです。これは、probalyの厳密な/スコープを使用すると何かがあるが、私はこれを回避する方法を見つけることができないようです。

は本当に誰かが私が

UPDATE 最初のスクリプトは、プロトタイプのクラスを持って助けることができると思います。

このクラスは、2番目のスクリプトでインスタンス化されています。ハンドラの後。それで、最初のスクリプトが2番目のスクリプトの前にロードされているので、それでも動作しませんか？

また、私は、コンソールから行を実行する場合：

$("#trigger").trigger("noPossibilities"); 

それがトリガされません。このようにしてはいけませんか？

UPDATE 2

私は問題を発見しました。最初のスクリプトは、インスタンス化されたときにidトリガーを持つ要素をドキュメントに追加します。私はゲームの始めにポップアップを持っています。ハンドラは、そのボタンをクリックすると接続されます。

文書probalyに、ハンドラがアタッチされるべき要素がありませんでした。今は後で添付されていて、今は動作しています。

Answer 1

問題はスコープではなく、ハンドラが要素にアタッチする前にイベントをトリガしています。 document ready handlerのコードは、DOM要素がロードされた後にのみ実行されます。スクリプトの直後にトリガーしている場合、要素がまだロードされているので、それは機能しません。

トリガーの動作を別のコンテキスト内で確認するには、別のdocument ready handlerに移動します（ハンドラーが接続された後にのみ実行されます）。

$(document).ready(function() { 
 
    $("#trigger").on("noPossibilities", function() { 
 
    console.log("noPossibilities trigger"); 
 
    }); 
 
}); 
 

 

 
$(document).ready(function() { 
 
    $("#trigger").trigger("noPossibilities"); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="trigger"></div>