jQuery Mobile div as link and back button issue

Question

I am trying to make a simple app for myself and play a bit with jQuery mobile. I have created 3 simple sites:

http://jsfiddle.net/ZweUQ/2/

var clickEvent         


        

Answer 1

This is a common jQuery mobile problem. It is caused because multiple events are bind to same element. Every time you return to previous page you bind same event again.

There are 2 solutions for this problem.

1. Before you bind an event to some element check if that same event is not already bind.

   Example:

   $('.menu-browse:Event(!' + touchEvent + ')').each(function(){
       $('.menu-browse').bind(touchEvent, function(e) {
   
       });
   });
   

or

2. Each time you bind an event, unbind it before.

   Example:

   $(this).unbind();
   $(this).bind(touchEvent, function(e) {
   
   });
   

Sadly there are no bulletproof solutions for this problem.

Take a look now:

http://jsfiddle.net/Gajotres/ZweUQ/4/