JqTouch - trigger detection for animation

Question

Another problem with w / jqTouch ... I am trying to determine which item was pressed to trigger an animation so that I can pass parameters from the clicked item to the next page.

My HTML:

<div id="places"> <div class="toolbar"> <h1>Places</h1> <a class="back" href="#">Back</a> </div> <ul> <li id="1"><a href="#singleplace">Place 1</a></li> <li id="2"><a href="#singleplace">Place 2</a></li> <li id="3"><a href="#singleplace">Place 3</a></li> </ul> </div> <div id="singleplace"> <div class="toolbar"> <h1></h1> <a class="back" href="#">Back</a> </div> </div> 

When I click on any list item in #places, I can go to #singleplace just fine, but I'm trying to determine which item was clicked so that I can pass parameters to #singleplace cases. My javascript:

 var placeID; $('#places a').live('mouseup',function(){ $('#singleplace h1').html($(this).text()) placeID = $(this).parent().attr('id'); }) 

I tried several alternatives to the $ (el) .live ('event', fn ()) method, including:

 $('#places a').live('click',fn()... $('#places a').live('mouseup',fn()... $('#places a').live('tap',fn()... $('#places a').tap(fn()... 

None of them work. Is there a better way to handle this? I noticed the following on the jqTouch problems page: http://code.google.com/p/jqtouch/issues/detail?id=91 which may be part of the problem ...

Answer 1

If you are just trying to pass the information from which the list item was selected, you can attach onClick="function(event)" to the items ...

 <li><a id="1" title="first" onClick="send(event)" href="#singleplace">Place 1</a></li> 

then in js ...

 function send(event) { x=event.target; } 

where x.id=='1' x.title==first & x.text=='Place 1'

hope this helps a bit.

Answer 2

I found a solution:

• Use tap(function()...) instead of live('click',function()...)
• Use jQT.goTo('#singleplace', 'slide');
• use return false;

 var placeID; $('#places a').tap(function(){ $('#singleplace h1').html($(this).text()); placeID = $(this).parent().attr('id'); jQT.goTo('#singleplace', 'slide'); return false; }); 

This works for me, even in Firefox and Safari, not just mobile safaris.

Additional Information:
There seems to be a problem with a live event in JQTouch: http://code.google.com/p/jqtouch/issues/detail?id=165

Let me know if this also works for you.