Question

I have json data that is populating the dom and the json objects being added have IDs that are used for the window.hash

       $j.getJSON('js/looks.json', function(data){

            $j.each(data.looks, function(i, looks){
                var look = "<li class='style "+data.looks[i].type+"'>";
                look+= "<div class='overlay'></div>";
                look+= "<a href='#"+data.looks[i].person+"'><img src='../images/looks/landinglooks_"+data.looks[i].person+".jpg'/></a>";
                look+="</li>";
             });

      });

and the div this is linked to is output in json aswell:

<div id='"+data.looks[i].person+"' class='block steps'>

Outputs:

<li class="style fine"><div class="overlay"></div><a href="#gabrielle"><img src="../images/looks/landinglooks_gabrielle.jpg"></a></li>

Clicking this brings you to http:…/#/gabrielle which is a div that is also

<div id="gabrielle" class="block steps"></div>

This works fine, but it seems like on page load (if I try to load to …/#/gabrielle) nothing happens. jQuery Address doesn’t read the hash on pageload for the json loaded into the dom.

Is there a workaround or another deeplinking plugin that supports this?

Answer 1

I decided to use http://benalman.com/projects/jquery-hashchange-plugin/ worked like a charm!
I can call the hashchange trigger after the json is loaded.