1

私は使っている

<link rel="stylesheet" href="css/jquery.mobile-1.1.0.min.css" />
<script type="text/javascript" charset="utf-8" src="js/cordova-1.7.0.js"></script>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.1.0.min.js"></script>

ブラウザでテストするときに div をクリックできますが、Android エミュレータ 4.0 で試してみると、応答がありません。jquery mobile click は $(document).live('click',function()..) を使用する必要があり、私のコードは

<div data-role="content">             
        <p><img level='1' src="css/images/level1.png"/><a id="level" level="1" href="wordlist.html" data-role="button" data-theme="a">Home</a></p>
        <p><img level='2' src="css/images/level2.png"/><a id="level" level="2" href="wordlist.html" data-role="button" data-theme="a">School</a></p>
        <p><img level='3' src="css/images/level3.png"/><a id="level" level="3" href="wordlist.html" data-role="button" data-theme="a">Restaurant</a></p>

</div>

<script type="text/javascript" charset="utf-8">
$('a#level').live('click', function () {
    alert("XX"+ $(this).attr("level"));
    sessionStorage.StudyLevel = $(this).attr("level"); 
});
</script>

アラートがブラウザに表示されましたが、エミュレータでは何も起こりません。私のエミュレータで実行されない他のスワイプとタップイベントにも同じことが言えます。私は何かを逃しましたか?

4

3 に答える 3

1

idではなくclassで試しましたか:-

<div data-role="content">             
    <p><img level='1' src="css/images/level1.png"/><a id="level1" class='selCls' level="1" class="handler" href="wordlist.html" data-role="button" data-theme="a">Home</a></p>
    <p><img level='2' src="css/images/level2.png"/><a id="level2" class='selCls'  level="2" class="handler" href="wordlist.html" data-role="button" data-theme="a">School</a></p>
    <p><img level='3' src="css/images/level3.png"/><a id="level3" class='selCls'  level="3" class="handler" href="wordlist.html" data-role="button" data-theme="a">Restaurant</a></p>

そしてまた

 $('body').on('click', '.selCls', function(e) {
  e.preventDefault();
      e.stopImmediatePropagation();
      alert('clicked');
 });
于 2012-09-05T06:04:46.830 に答える
1

次のようなヘッダーのjqueryファイルのシーケンスを変更してみてください

<link rel="stylesheet" href="css/jquery.mobile-1.1.0.min.css" />
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/cordova-1.7.0.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.1.0.min.js"></script>
<script>
$(function() {
   $('a#level').bind('click', function(event, ui) {
     //code here.
   });
});
</script>

そして、これがうまくいったかどうか教えてください。

于 2012-09-05T07:06:32.980 に答える
-1

phonegap のドキュメントによると、他のすべての前にこのイベントをリッスンする必要があります。

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {
    // Now safe to use the Cordova API
    // Put your code here
}

イベントの添付には、(推奨) jquery .on()を使用できます

また、imgs の ID が重複していますが、これはお勧めできません。ダミークラスを使用して、代わりに次のように検索できます。

<div data-role="content">             
        <p><img level='1' src="css/images/level1.png"/><a id="level1" level="1" class="handler" href="wordlist.html" data-role="button" data-theme="a">Home</a></p>
        <p><img level='2' src="css/images/level2.png"/><a id="level2" level="2" class="handler" href="wordlist.html" data-role="button" data-theme="a">School</a></p>
        <p><img level='3' src="css/images/level3.png"/><a id="level3" level="3" class="handler" href="wordlist.html" data-role="button" data-theme="a">Restaurant</a></p>

</div>

<script type="text/javascript" charset="utf-8">
$('a.handler').on('click', function () {
    alert("XX"+ $(this).attr("level"));
    sessionStorage.StudyLevel = $(this).attr("level"); 
});
</script>
于 2012-09-05T01:09:32.770 に答える