Question: I have the following listener set up for "pagebeforechange" (very similar to the jQuery Mobile Documentation's own code) and a link on the home page that is calling <http://localhost/#product?id=255979>

```
//Bind Listener for Product Details
$(document).bind( "pagebeforechange", function( e, data ) {
    //Only Run If Site is Initialized
    if( ajaxSite.options.initialized ) {
        if ( typeof data.toPage === "string" ) {
            var u = $.mobile.path.parseUrl( data.toPage ),
                pl = /^#product/;

            if ( u.hash.search(pl) !== -1 ) {
                console.log("showProduct being called.");
                ajaxSite.showProduct( u, data.options );
                e.preventDefault();
            }
        }
    }
});

```

When I open up the JavaScript console and click the link I am seeing the following:

```
showProduct being called.
showProduct being called.

```

I can't seem to find anything about why it would be getting called twice. I have seen other errors where vclicks get registered twice due to edge-clicking, but this doesn't make any sense since it is relying on the actual page change.

Answer: 
Since you're binding to the $(document) and using a Multi-page layout

* <http://jquerymobile.com/demos/1.0/docs/pages/index.html>

I think jQM is loading the document multiple times (Just a hunch)

Switch to using the pageId instead, example:

```
$(document).bind( "pagebeforechange", function( e, data ) { ...

```

to

```
$('#pageId').bind( "pagebeforechange", function( e, data ) { ...

```
If you read jquery mobile documentation <https://api.jquerymobile.com/pagebeforechange/> , it says it is called twice, once data.toPage being url to new page, second time data.toPage being already jquery object of new page.