Jquery Click event - A Nightmare !

Question

I have one link button with a click event. When Clicked I want to change its click event handler to call another method. I am using this :

$('#' + test).bind('click', function () { return LikeComment(test, CommentsWrapper, activityID, textAreaID, btnAddCommentID, addCommentBox, textUnLike, textLike, likeWrapperID); });

The next time it is clicked I bind it with this :

 $('#' + test).bind('click', function () { return UnLikeComment(test, CommentsWrapper, activityID, textAreaID, btnAddCommentID, addCommentBox, textUnLike, textLike, likeWrapperID); });

The thing is the handlers are buffering. the second time I click the link, the 2 methods are called.

Nothing helped. I used unbind() same thing.

Any suggestions ?

More Info

The initial status of the link button is like this :

  <a class='activitysmalllink' href='javascript:void' id='{0}' onclick='return LikeComment( ... ) '

When I click the LIKE link button, I invoke this code :

  $('#' + test).bind('click', function () { return deleteLikeComment(test, CommentsWrapper, activityID, textAreaID, btnAddCommentID, addCommentBox, textUnLike, textLike, likeWrapperID); });

 $('#' + test).text(textUnLike);

the weird thing is that this method is invoked as soon as I bind the link using the above following code.

Answer 1

You need to unbind click before you re-bind it.

Just put .unbind('click') in between $('#' + test) and .bind('click' for each statement.

Answer 2

i think the problm is with $('#' + test). define a variable first as var a='#' + test; then give the jquery statement as $(a)..

Answer 3

Something is messing up with your unbind: can you provide more code?

As an alternative (and prehaps, bette solution), how about toggle() instead?

$('#' + test).toggle(function () { return LikeComment(test, CommentsWrapper, activityID, textAreaID, btnAddCommentID, addCommentBox, textUnLike, textLike, likeWrapperID); },
                     function () { return UnLikeComment(test, CommentsWrapper, activityID, textAreaID, btnAddCommentID, addCommentBox, textUnLike, textLike, likeWrapperID); });

You could also use one() instead of bind()

Answer 4

Unbind() unbinds events bound before with jQuery's bind.
But in your case the event initially is listed inside the element

<a onclick='return LikeComment...

...so it would'nt be affected by unbind()

Use attr() instead of unbind()

$('#' + test).attr('onclick','').bind('click','...')

...before binding the first time. if you dont want to check if it's the first call, you could always use

$('#' + test).attr('onclick','').unbind('click').bind('click','...')