Search code examples
javascriptjqueryjquery-mobilehrefpreventdefault

JQuery href preventdefault issue with anchor


I have a link as following.

<a href="#" id="tab3Link">Tab 3</a>

On tab 2, when Tab 3 is clicked, I want to first validate whether form in Tab 2 is correctly filled.

    $("#tab3Link").click(function(e){
        e.preventDefault();
        $("#tab3Link").prop("href", "#");
            if(validateTab2()){
                $("#tab3Link").prop("href", "#tab3Info");
                return true;
            }else{
                return false;
            }
    });  

#tab3Info anchor should take the page to a new div. But click does not happen. But if I manually append #tab3Info at the end of the URL and press enter, page moves to new tab. So in the above function, although href is changed, click function does not happen.

This is working fine when JQuery 1.4.2 is used with Jquery mobile 1.1.0. Problem occurs when JQuery was upgraded to 1.9.1 and Jquery mobile to 1.3.2.


Solution

  • Instead of return true, try:

        $(this).unbind('click');
        $(this).click();