D
D
Denis Bukreev2016-11-05 01:09:37
JavaScript
Denis Bukreev, 2016-11-05 01:09:37

How to manipulate address bar with javascript?

So it goes.
I had a task: when opening a modal window, change the address bar so that you can send the address to another user and this window opens for him.
At the same time, it is necessary that when a certain address is opened, not only a modal window opens, but also some parameters on the page change - they are changed using php, because. for sharing, it is necessary that the initial page contains the necessary information.
We decided everything with a crutch.
The line was changed using hashes so that users could share with each other.
But for php, the processing of GET parameters was prescribed.
Wretched. Since in JS it was necessary to check both hashes and GET parameters when loading the page.
So. How could this problem have been solved differently?
Ideal: when you open a modal, the address changes not to /palette#c304, but to /palette/c304/- as with ajax page transitions. But I don’t really know how SPA works from the inside.

Answer the question

In order to leave comments, you need to log in

2 answer(s)
K
Kanonier8, 2016-11-05
@denisbookreev

As you already wrote, you should use the HTML5 History API to manipulate the address bar
. I think these first links from Google will help you understand the issue.
https://habrahabr.ru/post/123106/
https://developer.mozilla.org/ru/docs/Web/API/Hist...
https://css-tricks.com/using-the-html5- history-api/
well, and another example using history.js for a dinosaur
https://astrio.ru/blog/History-API/

F
frees2, 2016-11-05
@frees2

Так у меня уже лет шесть работает, только не локацион.... Надо еще правильно в .htaccess тоже прописать релоад. ........

<span onclick="player.loadVideoById(\''.$videoId.'\', 0);history.pushState(\''.$videoId.'\', null, \''.$videoId.'\');document.title = \''.$title3.'\';return false">&#9668; &nbsp;&nbsp; <img src="'.$thumbnails.'" align="right" hspace=" 4px" width="60" height="47" > &nbsp;&nbsp;'.$title.'</span>  <br> <button type="submit" name="message" value="'.$title.',live5" style="border: 0; cursor: pointer;  background: transparent">

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question