Question

I want to disable a button after a user did rate a certain post, using Ajax. The goal is to avoid an unnessary increase of the votes for this post.
Here is code,help me

<script type='text/javascript'>
$(function(){
    $("a.vote_up").click(function(){
    //get the id
    the_id = $(this).attr('id');

    // show the spinner
    $(this).parent().html("<img src='images/spinner.gif'/>");

    //fadeout the vote-count 
    $("span#votes_count"+the_id).fadeOut("fast");

    //the main ajax request
        $.ajax({
            type: "POST",
            data: "action=vote_up&id="+$(this).attr("id"),
            url: "votes.php",
            success: function(msg)
            {
                $("span#votes_count"+the_id).html(msg);
                //fadein the vote count
                $("span#votes_count"+the_id).fadeIn();
                //remove the spinner
                $("span#vote_buttons"+the_id).remove();

            }
        });
    });


}); 
</script>

Answer 1

You can use Jquery .one() to bind a single click to your a tag:

See this Fiddle Example!

$(function(){
    //click only once
    $("a.vote_up").one("click", function(e) {
        e.preventDefault();
        $('p').append('clicked ');
    });
});

Note:

Added e.preventDefault(); to disallow the browser from following the href attribute. (read here)