'Jquery Mobile Page Links Causing Duplication

I am building a site using JQuery mobile 1.4.5. It consists of 3 pages (index.html, blog.html, blog-category.html). When the home page loads, there is a link to the blog page. I am using the following code to pass the variables:

$.mobile.changePage("blog.html", {
    dataUrl : "blog.html?user=" + travel_user_id,
    data:{ user: travel_user_id },
    transition: "slide",
    reverse: false,
});

This works and pulls up the blog page.

On the blog page I have a back button:

 <a href="javascript:void(0);" onclick="history.back()" data-direction="reverse" data-transistion="slide" class="back-btn ui-btn ui-corner-all ui-shadow ui-mini ui-btn-inline ui-icon-back ui-btn-icon-right">back</a>

Which takes you back to the homepage. If I click the blog link again, it slides left twide, so it transitions to the blog page, then transitions again. If I click the back button, then the blog button again, it doubles, so slides left 4 times.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source