jQueryはajaxのロード後に要素を選択できません

Question

多くの研究の後、私は答えを見つけませんでした。私はWordpressのテーマTwenty Twelveを使用しています。これはajaxリクエストを介してページを読み込むようです。私は、ページ上の別の要素を表示したり非表示にするボタン（＃header-navigation-link）を持っています。これはajax呼び出しのない最初のページの読み込み時に機能しますが、別のページに移動するとajaxがロードし、プログラムは＃nav-mobile-wrapperを見つけることができなくなります。すべてのAJAXロードされたページのアラートで

 $(document).on('click', "#header-navigation-link", function() { 

     $(document).find("#nav-mobile-wrapper").fadeToggle(); 
     alert('Success!'); 
    }); 

常にポップアップするので、表示し、非表示にする要素だけで、ボタンを見つけることではないです。 ＃nav-mobile-wrapperをクリックして＃header-navigation-linkを切り替えるように2つのスワップも試してみましたが、同じことはまったく同じです。

この機能では、＃nav-mobile-wrapperのターゲットには何が欠けていますか？

お手伝いいただける方に感謝します。

Answer 1

IDを知っている場合は、もう一度検索する必要はなく、単に選択してください。

$(document).on('click', "#header-navigation-link", function() {  
     $("#nav-mobile-wrapper").fadeToggle(); 
     alert('Success!'); 
    }); 

Answer 2

この要素（ "＃nav-mobile-wrapper"）もajaxによって生成されていますか？その場合は、クリック機能とこの要素が生成される場所が同じ「スコープ」内にあることを確認してください。例：

$(document).ready(function() { 
     $.ajax({ 
     // this is where you send the ajax request to server 
     {).done(function(response){ 
     //because you said, it loaded page via ajax request, so page's loading and #nav-mobile-wrapper's generating probably happened here 
     // If so, try put your click function here, inside the 'done' block! 
     &(document).on('click',"#header-navigation-link",function(){ 
     // your stuff 
    }); 
    }) 

なぜ＃nav-mobile-wrapper要素が見つからないため、機能が動作しないと思います。あなたのコードがなければ、これは私が持つことができる最高の推測です。とにかく、まだこの問題がある場合は教えてください。

ところで、私は

$("#header-navigation-link").on('click',function(){ 
// you code 
}); 

だと思うが読み書きする簡単な方法です:)