Hello. Is it possible to catch changes in the address bar of the data hash, always when entering, erasing or inserting any data? Only without using HTML5, but only in JavaScript or on jQuery. Is this even possible?

  • meaning the string after the # ? - Grundy
  • @Grundy Yes, after # - J. Doe
  • why not using HTML5 and what is meant by this? - Grundy
  • in HTML5 there is a kind of plugin that copes with this task. And I want to try without using these technologies, so to speak, to begin with the basic things of this technology. - J. Doe
  • What kind of plugin in HTML5? - Grundy

1 answer 1

When the part of the URL following the # changes, including the # sign itself, a hashchange event is generated .

 window.addEventListener('hashchange', function(e) { console.log(e.newURL); }); document.getElementById('btn').addEventListener('click', function(e) { location.hash = 'button_clicked'; }); 
 <a href="#first">first</a> <button id="btn">Change Location hash in js</button>

Characteristically, this event is part of the HTML5 specification, but the link provided also shows the implementation of the polyfile.

  • Something I can not catch changes in the address bar (( - J. Doe
  • I try to catch the console, but there is emptiness - J. Doe
  • @ J.Doe, then you are doing something wrong. When the address changes after # and its application, the specified event is triggered. If you wanted to track in real time, that is, at the very moment of editing, adding or deleting a character after # then naturally the event does not work, because hash has not changed yet and all changes can be canceled, for example, using the Esc key - Grundy
  • In this example, the change trapping works, but the current when clicking on the link. And how to catch changes without going to the link? - J. Doe
  • @ J.Doe, when you press a button, a hash change also occurs and is also caught, the provided code is absolutely working, and catches any changes to hash - Grundy