jQueryでバインド 'touchstart'イベントがアンドロイドphonegapとバックボーンで動作しない

Question

私はバックボーンに次のテンプレートを持っていますが、すべて完全にレンダリングされます。それが動作

<a href="#" data-role="button" id="button1" class="suggested-unselected"></a> 
    <script type="text/javascript"> 
      document.getElementById('button1').addEventListener('touchstart', select, false); 

     function select(){ 
      alert('test'); 
     } 
     function unselect(){ 
      alert('unselect'); 
     } 
    </script> 

：私は以下の書いた場合

<a href="#list" data-role="button" id="button" class="all-unselected"></a> 
    <a href="#" data-role="button" id="button" class="suggested-unselected"></a> 
    <a href="#" data-role="button" id="button" class="friends-unselected"></a> 
    <a href="#" data-role="button" id="button" class="private-unselected"></a> 
    <a href="#" data-role="button" id="button" class="buzz-unselected"></a> 
    <script type="text/javascript"> 
     var buttons = $("a#button"); 

     for(var i=0; i<buttons.length; i++){ 
      $(buttons[i]).bind('touchstart', select, false); 
      $(buttons[i]).bind('touchend', unselect, false); 
     } 

     function select(){ 
      alert('test'); 
     } 
     function unselect(){ 
      alert('unselect'); 
     } 
    </script> 

touchstartは、しかし、トリガされません。 jQueryがイベントをバインドできないかのように。何が問題なのでしょうか？

Answer 1

コードにはいくつかの問題があります。すべての

まず：

var buttons = $("a#button"); 

これは、ID buttonとアンカー要素を選択します。 IDは一意でなければならないので、これは1つの要素だけを返すべきです。しかし、あなたは戻り値をループしようとしています。それはあなたがそれをしようとしているように働くべきではありません。

第二：

あなたはあなたが通常それらを反復するため.each()を使用して選択したjQueryオブジェクトのセットを持っている場合。しかし、イベントハンドラをオブジェクトのセットにバインドしようとしている場合、jQueryはイベントをセレクションにバインドすることができるので、ループ内でこれを行う必要はありません。

サード： - addEventListener構文と構文異なる作品-ing

.bind()、あなたは.bind()を混合しています。だから、

、あなたの作業非jQueryの-例を翻訳する（これはところでjQueryのを使用しないように悪くはない）のjQueryに、これは次のようになります。私は前にあなたのコードを試してみました

$('#button1').bind('touchstart', select); 
$('#button1').bind('touchend', unselect); 

function select(){ 
alert('test'); 
} 

function unselect(){ 
alert('unselect'); 
}