Allora: supponiamo che tu abbia una funzione JavaScript caricaPagina(url); che ti carica i contenuti dall'url specificato e li scrive nella pagina corrente.
Ora, se usi jQuery puoi fare così:
Codice HTML:
<script type="text/javascript">
$(document).ready(function ( )
{ // Al caricamento del documento, imposta le azioni che vuoi.
$("a.usaAjaxPerCaricare").click(function ( )
{ // Al click, carica la pagina via AJAX.
var url = $(this).attr('href'); // L'URL che volevi.
caricaPagina(url); // Carica la pagina.
history.pushState(null, null, url); // Imposta l'URL sulla barra degli indirizzi. Se vuoi impostare un titolo (che però non serve a niente, perché non è supportato da nessun browser, al momento), scrivilo come secondo argomento al posto di "null".
window.addEventListener('popstate', function ( ) { caricaPagina(location.pathname); }); // Quando l'utente preme "Indietro" sulla cronologia, ripete la stessa azione, ma al contrario.
});
});
</script>
Dovrebbe funzionare, ma sono andato un po' a braccio, quindi gli errori di battitura si nascondono sicuramente fra le righe di codice, pronti a tendere un agguato.
PS: guarda anche questo.
EDIT: Ok, sono un idiota. Ho risposto a tutto meno che alla tua domanda.
Allora: in data non so cosa ci vada messo. So solo che deve essere codice JSON, ma quale siano le opzioni a me è ignoto.
Il motivo della seconda funzione (window.addEventListener('popstate', ...) da me) è questo: una volta che hai caricato la nuova pagina siamo tutti felici e contenti, ma se poi l'utente decide di tornare indietro? Se si ricaricasse l'intera pagina, svanirebbe la magia. Dunque "intercettiamo" l'evento prima che il browser ricarichi tutta la baracca, richiamando la stessa funzione di prima.