1
Well, I researched a navigation without refresh, it worked, but it does not change the url of the browser search bar, how can I make it change? Here is my code from js
$(document).ready(function(){
var content = $('#content');
//pre carregando o gif
$('a').live('click', function( e ){
e.preventDefault();
content.html( '<div class="loader"></div>' );
var href = $( this ).attr('href');
$.ajax({
url: href,
success: function( response ){
//forçando o parser
var data = $( '<div>'+response+'</div>' ).find('#content').html();
//apenas atrasando a troca, para mostrarmos o loading
window.setTimeout( function(){
content.fadeOut('slow', function(){
content.html( data ).fadeIn();
});
}, 500 );
}
});
});
});
Just as an introduction to the subject, this task is not as primary as it may seem. Programmatically changing the URL is even simple. There are two ways: a hash system (put a #hash) after the url, or actually change the path through the api history. But there are several extra concerns you need to have. For example, you have to think about setting up the server (in case you use the history api) to render ghost routes with the same content.
– mrlew
And, using either of the two options, you will have to prepare your code to, when the user enters, load the corresponding content. The theme you are looking for is javascript routes, and there are some libraries around like this one or this.
– mrlew
Finally, another thing is page States maintenance: the user clicks, turns, clicks again, advances, turns, and you will have to manually have control of the entire state of your application (since it doesn’t reset) somewhere. But that depends on the complexity of your system, of course. One last thing, just to illustrate, changing the routes on the client is usually a concept applied in SPA (single pages Applications) and in libraries as angular (ngRoute), React (React-Routes) etc.
– mrlew
@mrlew how can I do something cool? can you help me? I’m new to js
– Hanz
If you’re new to js, I definitely don’t recommend writing a route system from scratch. If your app is not SPA, chances are you won’t even need it. Or use a ready-made solution (library). Anyway, I just made a brief comment. The original question about changing the url has a simple answer. I just pointed out some repercussions for you to analyze if you need this. This last question of yours is too broad and is beyond the scope of the original question and the scope of this site. I recommend a study on language from its foundations. Evolution comes with time. Hugs and good luck.
– mrlew