0

私はちょうどtizen webを使用してSamsung Gear S3用のアプリケーションを開発し始めましたが、私はいくつかの問題を抱えています。私が直面している問題はかなり奇妙です。 次のコードでは、いくつかの項目がリストビューに表示されていますので、リストビューでアイテムをクリックしようとすると、エミュレータではクリックがトリガーされません。私はここで何をしているのかわからない。ここで ClickイベントがTizenEventで機能しない

はjavascriptのコードがあることがトリガーされるたびにスニペット項目

<script type="text/javascript"> 
     $('#dynamicList li').click(function(){ 
      //console.log($(this).attr('data-value')); 
      alert($(this).attr('data-value')); // this will alert data-value value. 

     }); 
    </script> 

完全なコードスニペット

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width,user-scalable=no"> 
    <title>Macy's MyStore app</title> 
    <link rel="stylesheet" href="lib/tau/wearable/theme/default/tau.min.css"> 
    <link rel="stylesheet" media="all and (-tizen-geometric-shape: circle)" href="lib/tau/wearable/theme/default/tau.circle.min.css"> 
    <!-- load theme file for your application --> 
    <link rel="stylesheet" href="css/style.css"> 
     <script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script> 
    <script src="app.js"></script> 
    <script src="lowBatteryCheck.js"></script> 


    <script src="js/jquery.min.js" type="text/javascript"></script> 
    <script src="js/jquery.js" type="text/javascript"></script> 

    <script src="js/orderProcesing.js" type="text/javascript"></script> 
</head> 
<script type="text/javascript"> 
    $('#dynamicList li').click(function(){ 
     //console.log($(this).attr('data-value')); 
     alert($(this).attr('data-value')); // this will alert data-value value. 

    }); 
</script> 
<body> 
    <div class="ui-page ui-page-active" id="main"> 
     <header class="ui-header"> 
      <h3 class="ui-title">Open Fulfillment Order</h3> 
     </header> 

     <div class="ui-content" id="ordersWidget"> 

      <ul class="ui-listview" id="dynamicList"> 
       <li> 
        <a href="#" data-value="S">1line</a> 
       </li> 
       <li> 
        <a href="#" data-value="M">2line</a> 
       </li> 
       <li> 
        <a href="#" data-value="L">3line</a> 
       </li> 
       <li> 
        <a href="#" data-value="S1">4line</a> 
       </li> 
       <li> 
        <a href="#" data-value="S2">5line</a> 
       </li> 
      </ul> 


      </div> 

     <footer class="ui-footer ui-bottom-button"> 
      <a href="#" class="ui-btn">Logo</a> 
    </footer> 
    </div> 


</body> 
</html> 

任意のアイデアの使用をクリック! DOMはさえにロードされる前に、ページのロードがそのように

//Adds click handler to #dynamicList li that are currently in the dom. 
$('#dynamicList li').click(function(){ 
    //console.log($(this).attr('data-value')); 
    alert($(this).attr('data-value')); // this will alert data-value value. 
}); 

完了するまで、あなたのjavascriptで待機いけない

答えて

0

はすでに実行されています。このコードの下、DOM内の項目の非は、このクリックハンドラーを持つことになりますので。

ドキュメント準備コールバックで、あなたのコードをカプセル化する必要があります

$(document).ready(function() { //dom is now loaded in. 
    $('#dynamicList li').click(function(){ 
     //console.log($(this).attr('data-value')); 
     alert($(this).attr('data-value')); // this will alert data-value value. 
    }); 
}); 
関連する問題