javascript - 動的にロードされたコンテンツのjqueryトリガーon('click')

Question

イメージ マップを使用する Web ページを作成しています。画像と地図は動的に読み込まれます。area 要素をクリックすると、新しいコンテンツがロードされます。また、URL のハッシュも変更されます (例: index.php#somepage)。ページの 3 つのレイヤーがあり、メイン レイヤー (ホームページ) にはマップ (index.php) を含む独自の画像があり、2 番目のレイヤーは新しい画像 + マップ (index.php#somepage) を提供し、3 番目のレイヤーはオーバーレイを開きますしたがって、ハッシュを変更します (index.php#somepage_somesubpage)。

index.php#somepage_somesubpage へのリンクを誰かに送信できるようにしたいと考えています。そのため、ハッシュをスライスし、最初のレベルでイメージマップのクリック メソッドをトリガーして、ページの読み込み時に index.php#somepage を読み込みます。それにコールバックを追加して、更新されたイメージマップの目的のクリック メソッドを呼び出します。これは、私が理解できない何らかの理由で機能しません。index.php#somepage を開くことはできますが、index.php#somepage_somesubpage に入ると同じ結果になります。

$(document).ready のコードは次のとおりです。

var cont = $('#content');

$( document ).ready(function() {
    cont.load('pages/home.php', function(responseTxt,statusTxt,xhr){
        if(statusTxt=='error')
        {
            cont.load('404.php');
        }
        lineparser('#content'); //Perform some fancy stuff on the page

        var hash = location.hash.replace('#', '');

        if (hash != ''){
            if(hash.indexOf('_') > 0)
            {
                //open page with content

                $('area[href~="#' + hash.slice(0, hash.indexOf('_')) + '"]').first().trigger("click", function(){
                    $('area[href~="#' + hash + '"]').first().trigger("click");
                });
            }
            else{
                //open menu page

                $('area[href~="#' + hash + '"]').first().trigger("click");
            }
        }
    }); 
});