Cordova / Jquery Mobile - Button clicks activating two pages?

Question

I am building a HTML5 app using Cordova / Phonegap and jQuery Mobile for page navigation.

I have a strange issue where if I click a button in for example the homepage header bar - the page transition is triggered as expected - but if there is a button in the same place on a subsequent page that page transition is also triggered at the same time!?

No idea why or how to approach a fix - has anyone experienced something similar? Or offer any suggestions?

The buttons are simply anchor links as follows -

<a  href="#paySuccess" data-transition="slide" class="paypal"><Span></Span></A>

Answer 1

Hello hereby I am attaching the similar example of page navigation in jquery mobile.

$(document).on('pageinit', '#index', function(){ 
    $(document).on('click', '#navigateButton', function(){        
        $.mobile.navigate( "#second", { transition : "slide", info: "info about the #bar hash" });
    });   

    $(document).on('click', '#navigateButton2', function(){        
        $.mobile.navigate( "#index", { transition : "slide", info: "info about the #bar hash" });
    });   
});

Please find the fiddle here for the same example: jquerymobile Navigation

Hope this will be useful. Thanks.