Manipulate Data In URL Parameters - jQuery gp-link
File Size: | 4.99 KB |
---|---|
Views Total: | 778 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
gp-link is a small jQuery plugin which helps developers add, remove, update parameters in the URL without loading the current web page.
See also:
How to use it:
1. Include jQuery library and the gp-link plugin (minified version) on the web page.
<script src="/path/to/jquery.min.js"></script> <script src="/path/to/gp-link.min.js"></script>
2. Add a parameter to the URL using the gplink
method.
<a href="index.html?param=1" class="full">Param 1</a>
$(document).ready(function() { $('a.full').gplink({ 'type': 'full' }); })
3. Add a parameter to the URL using the gplink
method.
<a href="index.html?param=1" class="full">Param 1</a>
$(document).ready(function() { $('a.full').gplink({ 'type': 'full' }); })
4. Add & update the URL parameters using data
attributes.
<button data-gplink-param="say" data-gplink-value="hello"> Custom Param 1 (say=hello) </button> <button data-gplink-param="color" data-gplink-value="green"> Custom Param 2 (color=green) </button> <button data-gplink-param="name" data-gplink-value="john"> Custom Param 3 (name=john) </button> <button data-gplink-param="page" data-gplink-value="about" data-gplink-full="current"> Custom Param 4 (name=john) </button> <button data-gplink-param="s" data-gplink-value="mykey" data-gplink-full="http://127.0.0.1:5500/about.html"> Custom Param 5 (name=john) </button>
5. Remove a specific parameter from the URL.
<span data-gplink-rm="say">Remove Say Param</span>
6. Remove all URL parameters.
<span data-gplink-rm="clear-all">Remove All</span>
Changelog:
2019-08-16
- Fixed "Remove Param" function
This awesome jQuery plugin is developed by ucoder92. For more Advanced Usages, please check the demo page or visit the official website.