在Android瀏覽器中使用JQuery Mobile添加單擊事件處理程序時出現問題

我在android瀏覽器中遇到了一個奇怪的問題。希望這是我從根本上做錯了，而不是一個JQuery的錯誤。我已經在Firefox和Chrome中嘗試了以下代碼，可以正常工作。但是，當我在Android瀏覽器中嘗試它時，單擊Get Tweets按鈕不起作用。這似乎是JQuery Mobile的一個問題，因爲當我將事件添加到正常的非JQuery Mobile對象時，它會正確綁定並且console.log會觸發。我已經嘗試過使用JQuery Mobile的alpha和beta版本，但沒有運氣。在Android瀏覽器中使用JQuery Mobile添加單擊事件處理程序時出現問題

<!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>

此腳本在android瀏覽器中也失敗。

$('#page').live('pagecreate',function(event){ 
     console.log('page loaded'); 
     $(".tweetjack").click(function() { 
      console.log('test'); 
     }); 
    });

來源

2011-07-05 Caimen

嘗試使用「pagecreate」事件，而不是$（文件）。就緒（）：http://jquerymobile.com/demos/1.0 b1 /＃/ demos/1.0b1/docs/api/events.html –

我用這個替換了.ready（），並且再次出現同樣的問題。點擊事件處理程序在除android手機之外的所有瀏覽器中都能正常工作 – Caimen

您如何查看控制檯？ –

這樣看來，我只是在做它的時候居然還有現在做這些事情的jQuery Mobile的方式老式JQuery的方式。這是正確的代碼。

$('#page').live('pagecreate',function(event){ 
    console.log('page loaded'); 
    $(".tweetjack").live('tap',function(event) { 
     console.log('test'); 
    }); 
});

來源

2011-07-05 17:48:55 Caimen

JQM似乎攔截點擊，並將href設置爲'＃'，如果您試圖攔截它們會導致一些破壞。這爲我工作，處理鏈接JQM到達前：

$(document).bind("pageinit", function() { 
    $("a").bind("click", function(e){ fix_mobile_links(this, e) }); 
}

來源

2012-09-25 06:58:29 Kevin

在Android瀏覽器中使用JQuery Mobile添加單擊事件處理程序時出現問題

回答

相關問題