How to prevent page refresh when tag clicked?

Question

I need to pass a parameter into the URL and at the same time prevent page from reloading when I click any tag with a blank href attribute (

Answer 1

window.location.hash="inbox/1" can update the hash value in the url. This can be done with the event preventDefault code.

Answer 2

Use jQuery's fancy selectors, especially the attribute equals one.

Using it, you can select only <a> tags which have a blank href attribute:

$('.list-group-item a[href=""]').click(function(event) {
  event.preventDefault();
});

The $('.list-group-item a[href=""]') selector narrows the collected elements to only those anchor tags with a class of list-group-item and a blank href.

That means all other anchor tags will work fine.

Answer 3

Try the following code

  $('.list-group-item a').click(function (event) {
   event.preventDefault();
   var url = $(this).attr('href');
   window.history.replaceState("object or string", "Title",url); // this will change your url
 });

For More details http://spoiledmilk.com/blog/html5-changing-the-browser-url-without-refreshing-page/

Answer 4

You can use Attribute equal selector to prevent click event in case of blank href like,

$('.list-group-item a[href=""]').click(function (event) { // where href are blank
   event.preventDefault();
});

And I would like to suggest don't make empty the href's, you can place # if no links are there.