jquery mobile + phonegap onclick

Question

我一直想弄清楚，但仍然卡住了。 所以我使用PhoneGap for iOS和JQueryMobile。 我试图显示单击按钮时的警报。

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" /> 
<!-- If your application is targeting iOS BEFORE 4.0 you MUST put json2.js from http://www.JSON.org/json2.js into your www directory and include it here --> 
<script type="text/javascript" charset="utf-8" src="cordova-1.6.1.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"> 
     </script> 
    <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"> 
     </script> 

，我有这个

<a href="#" id="button" data-role="button" data-theme="b"> Login </a> $(document).ready("#button").click(function() { alert('button clicked'); });

当我试图在Chrome推出这个，这个工作正常。然而，当我使用iphone模拟器时，它不显示任何东西。

Answer 1

对于你在一个JQM应用程序中使用DOM已准备就绪即

$(function(){ // <-- this is a shortcut for $(document).ready(function(){ ... }); 
    $('#button').click(function(){ 
     alert('button clicked'); 
    }); 
}); 

但是一个正常的Web应用程序是有用得多绑定到“pageinit”，即

$(document).on('pageinit','[data-role=page]',function(){ 
    $('#button').click(function(){ 
     alert('button clicked'); 
    }); 
}); 

结合pageinit作品更好，因为JQM将新页面插入与第一页相同的dom。正因为如此，你准备好的所有代码都不会再被调用。所以，我上面提到的第一部分代码只适用于JQM应用程序的第一页。无论您的按钮位于哪个页面，第二个都可以工作。请让我知道我是否可以为您进一步澄清此问题。