Question

I’m sure this is very simple, but I’m not getting it.

I’m using the following AJAX script to load content from a particular div of an external page into a div of the same name on my root page.

    $(function() {

    var newHash      = "",
        $mainContent = $("#main-content"),
        $pageWrap    = $("#page-wrap"),
        $el;


    $(document).delegate(".dyn a", "click", function() {
        window.location.hash = $(this).attr("href");
        return false;
    }); 


    $(window).bind('hashchange', function(){

        newHash = window.location.hash.substring(1);

        if (newHash) {

            $mainContent
                .find("#guts")
                .fadeOut(200, function() {
                    $mainContent.hide().load(newHash + " #guts", function() {
                        $mainContent.fadeIn(200, function() {
                            $pageWrap.animate({

                            });

                        });
                        $(".dyn a").removeClass("current");
                        $(".dyn a[href="+newHash+"]").addClass("current");
                    });
                });
        };

    });
    $(window).trigger('hashchange');
});

Could someone please help me with changing the title of the root page for the title of the page I am loading?

I have tried using:

var newTitle = $(responseHtml).filter('title').text();
document.title = newTitle;

As it mentions in this post, which almost worked but stopped the ajax functioning correctly. I’m not sure, though whether I am placing this in the right place.

Thanks in advance!

Answer 1

I managed to achieve this by adding the following to the hashchange function:

   String.prototype.toTitleCase = function(n) {
   var s = this;
   if (1 !== n) s = s.toLowerCase();
   return s.replace(/\b[a-z]/g,function(f){return f.toUpperCase()});
   }

   newHash = window.location.hash.substring(1);         

   function changeTitle(title) { 

   document.title = window.location.hash.replace("#","").replace(/[_]/g,"").replace(".html","").replace("and","+").toTitleCase(); }
   changeTitle("");

This takes the title from the page filenames, removes the hash and any underscores, then capitalizes the first letter of each word.

I’m certain there’s a better, simpler way of doing this. What I’ve got will do for now.