jQuery URL Manipulation Plugin Demos

Download This Plugin Back To jQueryScript

A set of functions to easily manipulate and interact with URLs in your web applications.

URL change

You can change the URL by calling the function $.urlChange(pathname).
Parameters:
- pathname is required and must be a URL pathname.

Example:

Also you can easly change the URL by using the HTML attribute data-url-change="/pathname"
Need a callback? Use data-callback="functionName()".

Example:

URL pathname change

You can change the URL pathname by calling the function $.addPathname(pathname, queryParams).
Parameters:
- pathname (URL pathname) [string | required]
- queryParams (Query parameters) [object].

Example:

Also you can easly change the URL pathname by using the HTML attribute data-url-pathname="/pathname"
Need a callback? Use data-callback="functionName()".

Example:

Query parameters

Add or replace query parameter

You can add or replace the query parameter by calling the function $.addUrlParam(key, value).
Parameters:
- key (Query parameter key) [string | required]
- value (Query parameter value) [string | numeric | required].

Example:

Also you can easly add or replace the query parameter by using the HTML attribute data-url="add-param" data-key="animal" data-value="lion"
Need a callback? Use data-callback="functionName()".

Example:

Get all query parameters

You can get all query parameters by calling the function $.getUrlParams(url).
Parameters:
- url (By default: current URL) [string]

Example:

Get a single query parameter

You can get single query parameter by calling the function $.getUrlParam(key).
Parameters:
- key (Query parameter key) [string | required]

Example:

Delete query parameter

You can delete a query parameter by calling the function $.removeUrlParam(key).
Parameters:
- key (Query parameter key) [string | required]

Example:

Also you can easly delete a query parameter by using the HTML attribute data-url="remove-param" data-key="color"
Need a callback? Use data-callback="functionName()".

Example:

˝ ˝

Remove all query parameter

You can remove all query parameters by calling the function $.setUrlParams(null).

Example:

Also you can easly remove all a query parameters by using the HTML attribute data-url="remove-all-params"
Need a callback? Use data-callback="functionName()".

Example: