jQuery autocomplete and back button behaviour?

I'm using the awesome jQuery autocomplete plugin. However I'm a bit of a newbie when it comes to understanding browser behaviour and Ajax, so I have a question.

This is the sequence of events:

1. User types 'fish' into text box
2. User chooses book title from list of autocomplete options - Fish Farming, Fish Frying, etc
3. HTML loads on page (as ajax) - 'click here for Fish Farming'
4. User clicks on link and loads Fish Farming page
5. User decides Fish Farming isn't for 开发者_运维知识库them, clicks on 'back' button - and returns to an empty page!

How can I change this so that when the user returns to the home page, they see the Fish Farming html - the page they were just looking at?

This is my autocomplete code:

    // Autocomplete listener.
    $("#q").catcomplete({
            source: "/book_results",
            select: function(event,ui) {
                $('#book_results').html(load_img);
                if (ui.item.category=="Books") { 
                    $.bbq.removeState();
                    var paramsObj = { 'b' : ui.item.id };
                    $.bbq.pushState( paramsObj );
                    get_books(null, null, null, ui.item.id);
                } else {
                    $.bbq.removeState();
                    var paramsObj = { 's' : ui.item.id };
                    $.bbq.pushState( paramsObj );
                    get_books(null, ui.item.id, null);
                }
            }
    });

As you can see, I'm already using the BBQ plugin to update the URL fragment when the user chooses something from autocomplete, just because it seemed like a good idea.

So I have my book_id set in the hash - but how can I ensure that the relevant HTML loads when the user clicks Back?

Thanks!

---

As the user makes choices append anchors to URI or session state.

Make new events for the back and forward buttons and traverse the lists accordingly.