I'm creating a dynamic website. My problem is when i click on the following tag:

<a class="s-inte" href="set_interesantes.php?n=Frank Melo&u=f6e79cfe9c0ecc4c08dac4c860c4802b&back=http://localhost:8085/Something/success/profile.php?search_user=f6e79cfe9c0ecc4c08dac4c860c4802b&p=12&sa=f6e79cfe9c0ecc4c08dac4c860c4802b&i=2345123&dl=&iv=1">Interesante</a>

The page gets refreshed, How do I avoid this page refresh?

I'm creating a dynamic website. My problem is when i click on the following tag:

<a class="s-inte" href="set_interesantes.php?n=Frank Melo&u=f6e79cfe9c0ecc4c08dac4c860c4802b&back=http://localhost:8085/Something/success/profile.php?search_user=f6e79cfe9c0ecc4c08dac4c860c4802b&p=12&sa=f6e79cfe9c0ecc4c08dac4c860c4802b&i=2345123&dl=&iv=1">Interesante</a>

The page gets refreshed, How do I avoid this page refresh?

• javascript
• php
• jquery
• html

• 4 are you wanting the link to open the page in a different instance of the browser??? I don't understand what you are asking. – T McKeown Commented Jan 26, 2014 at 5:08
• I would like the tag play the role like facebook ones. Example: When you click on facebook anchor 'Like' the page doesnt refresh. – Pepe Perez Commented Jan 26, 2014 at 5:13
• 2 Why do you have a URI in the href to begin with if you don't want it to load as a page? – DA. Commented Jan 26, 2014 at 5:16
• Well i'm a little nub on this, The file inside the href '<a>' tag get parameters via $_GET to count the interesantes(Interestings) and saves into a table, which play the role of a 'Like'. – Pepe Perez Commented Jan 26, 2014 at 5:25
• You likely want to put that information elsewhere rather than in the href itself. As you are using jQuery, I'd suggest storing it in an HTML5 data-* attribute (at which point you can put javascript:; into the href to prevent the browser loading a whole new page. – DA. Commented Jan 26, 2014 at 5:30

4 Answers 4

What you want to acplish is to update some counter of interestings w/o refreshing the page? You should do it using AJAX techniques, this is what AJAX was invented for.

Consider the following code, it's top easy (jQuery library required):

<a href="#" class="counter">Interesante</a>

<script>
$(function(){
    $("a.counter").click(function()
    {
         $.get("set_interesantes.php?n=Frank Melo&u=f6e79cfe9c0ecc4c08dac4c860c4802b&back=http://localhost:8085/Something/success/profile.php?search_user=f6e79cfe9c0ecc4c08dac4c860c4802b&p=12&sa=f6e79cfe9c0ecc4c08dac4c860c4802b&i=2345123&dl=&iv=1" );
         .... // you can do some animation here, like a "Liked!" popup or something
         return false; // prevent default browser refresh on "#" link
    });
});
</script>

you need to prevent default action on the click event.

You can do a simple inline handler which will return false

<a class="s-inte" onclick="return false" href="set_interesantes.php?n=Frank Melo&u=f6e79cfe9c0ecc4c08dac4c860c4802b&back=http://localhost:8085/Something/success/profile.php?search_user=f6e79cfe9c0ecc4c08dac4c860c4802b&p=12&sa=f6e79cfe9c0ecc4c08dac4c860c4802b&i=2345123&dl=&iv=1">Interesante</a>

or write a jQuery handler which will do the same

$('.s-inte').click(function(e){
    e.preventDefault()
})

If you are dynamically loading the content using ajax. You should probably call it in this way. This way it will work for every anchor with .s-inte class, no matter it's added dynamically or statically.

$(document).on('click', '.s-inte',function(e){
    e.preventDefault();

    // Do more stuff every anchor click here...
});

put href="javascript:void(0)"