Fatal编程技术网
  • javascript/
  • Javascript 在Android浏览器中使用JQuery Mobile添加单击事件处理程序时出现问题

Javascript 在Android浏览器中使用JQuery Mobile添加单击事件处理程序时出现问题

javascript jquery android jquery-mobile

Javascript 在Android浏览器中使用JQuery Mobile添加单击事件处理程序时出现问题,javascript,jquery,android,jquery-mobile,android-browser,Javascript,Jquery,Android,Jquery Mobile,Android Browser,我的android浏览器有一个奇怪的问题。希望这是我在做的根本错误的事情，而不是JQuery错误。我在Firefox和Chrome中尝试了以下代码，效果很好。然而，当我在Android浏览器中尝试时，点击GetTweets按钮不起作用。这似乎是JQuery-Mobile的一个问题，因为当我将事件添加到一个普通的非JQuery-Mobile对象时，它会正确绑定，并触发console.log。我尝试过jquerymobile的alpha和beta版本，但都没有成功 <!DOCTYPE html

我的android浏览器有一个奇怪的问题。希望这是我在做的根本错误的事情，而不是JQuery错误。我在Firefox和Chrome中尝试了以下代码，效果很好。然而，当我在Android浏览器中尝试时，点击GetTweets按钮不起作用。这似乎是JQuery-Mobile的一个问题，因为当我将事件添加到一个普通的非JQuery-Mobile对象时，它会正确绑定，并触发console.log。我尝试过jquerymobile的alpha和beta版本，但都没有成功

<!DOCTYPE html> 
<html>
    <head>
        <style type="text/css" rel="stylesheet" >
            .chkTag { color: black; }
            /*.chkFeed { color: black; }*/
        </style>
        <link rel="stylesheet" href="twitter/style/jquery.mobile-1.0a4.1.min.css"     />        
        <script type="text/javascript" src="twitter/js/jquery-1.6.1.min.js"></script>
        <script type="text/javascript" src="twitter/js/jquery.mobile-1.0a4.1.js">       
</script>
    <script type="text/javascript">
    $(document).ready(function() {            
        $(".tweetjack").click(function() {
            console.log('test');
        });
        console.log('page loaded');
    });
    </script>
    <style type="text/css">
        .profile img { width: 48px; height: 48px; display: inline; float: left; padding-right: 10px; }
        /*.ui-collapsible-contain { max-height: 950px; min-height: 950px; }*/
    </style>
</head>
<body>
    <div id="page" data-role="page" data-theme="d">
        <div id="header" data-role="header">
            <h1>Twitter App</h1>
        </div>
        <div data-role="content">
            <div id="1" class="tweetjack" data-role="collapsible" data-collapsed="true"><h3>Get Tweets</h3><p id="text1"></p><div data-role="collapsible" data-collapsed="true"><h3 date-theme="a">Filter</h3></div></div>
        </div>
        <div id="footer" data-role="footer">
            <a class="tweetjack"><h2>BT</h2></a>
        </div>
    </div>
</body>
</html>
看起来我只是用老式的JQuery方式来做，而现在有了一种JQuery移动方式来做这些事情。这是正确的代码

$('#page').live('pagecreate',function(event){
  console.log('page loaded');
  $(".tweetjack").live('tap',function(event) {
      console.log('test');
  });
});
JQM似乎会拦截点击，并将href设置为“#”，如果您试图拦截点击，可能会造成一些破坏。这对我来说很有效，在JQM访问链接之前处理链接：

$(document).bind("pageinit", function() {
   $("a").bind("click", function(e){  fix_mobile_links(this, e)  });
}
请尝试使用“pagecreate”事件而不是$（document）.ready（）：我用此事件替换了.ready（），并且再次替换了相同的问题。单击事件处理程序在除android mobile之外的所有浏览器中都能正常工作。您如何查看控制台？在firefox中我使用firebug，在android中我使用Dalvik调试监视器。在ddms中可以看到“页面加载”日志，但不会看到单击日志。两者都出现在萤火虫身上。 
$(document).bind("pageinit", function() {
   $("a").bind("click", function(e){  fix_mobile_links(this, e)  });
}