Allow Users to Add Hooks When Hash of URL Changes | JQueryHash

Allow-Users-to-Add-Hooks-When-Hash-of-URL-Changes

JQueryHash plugin allows users to add hooks when the URL hash change. A small jQuery plugin to handle the hash (#) in your URL and run the callback function when the URL Hash (the ID of part of the URL) changes.

js change url without reload, router hash fragment js, uselocation hash, usehistory with hashrouter, history push hashrouter

How to make use of it:

1. Download and put the jquery.jqueryhash.js script after loading the newest jQuery.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/jquery.jqueryhash.js"></script>

2. Trigger a callback function when the URL hash has modified.

<a href="#jquery" id="jquery">jQuery Hash</a>
<a href="#script" id="script">Script Hash</a>
$.onHash({
  hashes: [
    ['Web', function() { console.log('Hash Changed: jquery'); }],
    ['script', function() { console.log('Hash Changed: Code'); }]
  ]
});

3. Determine whether or not to trigger the callback only on the web page load.

$.onHash({
  hashes: [
    ['Web', function() { console.log('Hash Changed: jquery'); }],
    ['script', function() { console.log('Hash Changed: Code'); }]
  ],
  onlyOnLoad: true
});

4. Add a new handler to a hash.

$.onHash('onAddHandler', ['new', function() { 
  // do something
}]);

5. Update the handler.

$.onHash('onUpdateOne', ['new', function() { 
  // do something
}]);

6. Remove the callback of a hash.

$.onHash('onRemoveOneHandler', 'jquery');

7. Remove all callbacks.

$.onHash('onRemoveHashChange');

Handle URL Hash Change In jQuery, JQueryHash Plugin/Github


See Demo And Download

Official Website(MiguelFernandez008): Click Here

This superior jQuery/javascript plugin is developed by MiguelFernandez008. For extra Advanced Usages, please go to the official website.