Detect trigger for animation

Yet another problem I'm having w/ jqTouch... I'm trying to detect what element was clicked to trigger an animation so that I can pass parameters from the clicked item to the subsequent page.

My HTML is:

<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 of the list items in #places, I'm able to slide over to #singleplace just fine, but I'm trying to detect which element was clicked so that I can pass parameters into the #singleplace div. My javascript is:

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

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

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

None of which seem to work. Is there a better way I could be handling this? I noticed on jqTouch's issues page, there is this: http://code.google.com/p/jqtouch/issues/detail?id=91 which may be part of the problem...


If you're just trying to pass info from which list item was clicked, you could attach an onClick="function(event)" to the items...

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

then in the js...

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

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

hope that helps a bit.


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 only in mobile safari.

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

    Let me know if this also works for you.

    链接地址: http://www.djcxy.com/p/45152.html

    上一篇: SWT问题与syncExec()

    下一篇: 检测动画的触发器