jquery call javascript and change page issue

My html page have two div which data-role="page", one id is pageone to collect user information, one id is pageresult to display a calculation result of the user information. I use a button to call the javascript function to calculate the information and to show the pageresult,

<a data-role="button" href="#pageresult" id="btnTry">Try</a>

but when I click the button ,the javascript called well , I debug and confirm it .but the pageresult just show one second then the page change back to the pageone, and the url of the browser has been changed to : http://localhost:8080/my_project/JqueryPage/mypage.html#pageresult if I refresh the browser manually, the page will become the pageresult again. Here is the js function I call when click the button:

    $('#btnTry').click(function() {
        var var1 =  $("#selIsHasSpeed").val() ==""?"false":$("#selIsHasSpeed").val();
        var var2 =  $("#selIsWashSpeed").val() == ""?"false":$("#selIsWashSpeed").val();
        //some calculate process 
        var paragraphs = $('div#resultList p');
        paragraphs[0].innerHTML = Wdamage;
        paragraphs[1].innerHTML= Cdamage;
        showResultPage();
    catch(e){
        alert(e);}
    });
    });

the showResultPage() function :

    function showResultPage(xmlHttpRequest, status){
    setTimeout(function() {
        $.mobile.changePage("#pageresult", {
            'allowSamePageTransition' : true,
            'reloadPage' : true,
            'transition' : 'none'
        });
    }, 1);
    }

also I want change the result in the pageresult , when the pagerusult show a second first when I click the the result has been changed by the js . But when I manually refresh the page the result has not been changed it seems a old page!