如何製作一個phonegap可供選擇的可滾動div列表

Question

正如標題所述。我想製作div內的div元素列表。我希望能夠上下滾動列表，並且當列表不再滾動時，我希望能夠單擊列出的元素來做某件事。我不知道如何做到這一點。

只要用戶觸摸div，touchmove事件就會執行，即使div滾動。然後，我無法弄清楚如何使讓程序知道DIV心不是再滾動，所以元件上的一個觸摸將觸發非滾動事件.....

編輯：

我有什麼到目前爲止，這是...但這是一個快速的「修復」，它不按預期工作。例如，如果你快速上下滾動，那麼div會認爲你壓在其中一個元素上。

exerciseWrapper是滾動div內的元素。每個元素都包裹在exerciseWrapper中。

$('.exerciseWrapper').on('touchstart',function(){ 

     touchstart=true; 
       setTimeout(function(){ 

        touchstart=false;   
        }, 100); 

    }); 

    $('.exerciseWrapper').on('touchend',function(){ 

     if(touchstart) 
     { 
       $('.exerciseWrapper').not(this).css('border-color','black'); 
       $(this).css('border-color','orange'); 
     } 

    }); 

Answer 1

行，所以我終於想通這一個...爲什麼我想不出包裝上該解決方案在我的心目中，是因爲我不能讓其他事件，則eventstart和事件結束工作...當時的寫作我仍然無法得到其他事件，如eventcancel和eventleave工作。然而eventmove的作品，我解決了這個問題使用這個事件。當你移動你的手指時，eventmove會不斷更新它鏈接的元素。然後我有一個touchmove的變量，如果我正在滾動我的div（touchmove事件），它總是會變成true。當我停止移動，我可以clik再次選定的元素，並使用正常的eventstart事件..這是我的工作代碼：

var touchmove=false; 
function AddExercisesEvents() 
{ 
    $('#exerciseMenu').on('touchmove',function(){ 

      touchstart=true;  
         $('h1').text("move"); 

     }); 

    $('.exerciseWrapper').on('touchend mouseup',function(event){ 
        event.stopPropagation(); 
        event.preventDefault(); 
        // $('.exerciseWrapper').off(); 

       if(event.handled !== true) 
       { 
      touchstart=false; 

      //ENTERING editExercise Menu..! 
      if(!touchstart) 
       { 
     //insert magic here 
           alert($(this).attr('id')); 


       } 


       } 
        return false; 
           }); 
}