2016-11-26 7 views
4

У меня есть следующий код, и представляется очевидным, что JQuery работает, но некоторые JQuery Мобильные события не стрельбы на всех:Некоторые сенсорные события JQuery Mobile не стреляющие

<!DOCTYPE html> 
<html> 
    <head> 
     <title>JQuery Mobile Test</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <script src="js/jquery.js"></script> 
     <script src="js/jquery.mobile.custom.complete.min.js"></script> 
     <link rel="stylesheet" href="css/jquery.mobile.custom.complete.theme.min.css"/> 
     <link rel="stylesheet" href="css/jquery.mobile.custom.complete.structure.min.css"/> 
     <script> 
      $(function(){ 
       $(document).on("touchstart", function(e){ 
        $('#touchstart').html("touchstart"); 
       }); 
       $(document).on("touchend", function(e){ 
        $('#touchend').html("touchend"); 
       }); 
       $(document).on("touchmove", function(e){ 
        $('#touchmove').html("touchmove"); 
       }); 
       $(document).on("touchcancel", function(e){ 
        $('#touchcancel').html("touchcancel"); 
       }); 
       $(document).on("tap", function(e){ 
        $('#tap').html("tap"); 
       }); 
       $(document).on("taphold", function(e){ 
        $('#taphold').html("taphold"); 
       }); 
       $(document).on("swipe", function(e){ 
        $('#swipe').html("swipe"); 
       }); 
      }); 
     </script> 
     <style> 
     </style> 
    </head> 
    <body> 
     <div id="touchstart">-</div> 
     <div id="touchend">-</div> 
     <div id="touchmove">-</div> 
     <div id="touchcancel">-</div> 
     <div id="tap">-</div> 
     <div id="taphold">-</div> 
     <div id="swipe">-</div> 
    </body> 
</html> 

Я пытаюсь его на Chrome на Android. Из перечисленных событий они не работают: tap, taphold и swipe. Я проверил тройные URL-адреса файлов.

Версии JQuery выше: JQuery: сжатый, выпуск 3.1.1 и новейший JQuery Mobile: 1.4.5, настраиваемый со всеми параметрами, минимизированный.

Досадно работает, как ожидаются, когда я заменить ссылку и скрипт тег с (случайной) более ранней версией, устроенный JQuery:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" /> 
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script> 

И не работает, когда я использую последние JQuery-размещаемые версии:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> 
<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 

Но мне нужно размещаем файлы себя, и я хотел бы иметь самые последние версии. Что я делаю не так? Существуют ли различия в API? Или это ошибка JQuery?

+1

Это не работает с JQuery v3. Используйте более старую версию jQuery. Кроме того, я не рекомендую использовать пользовательскую версию jQM; создайте свои собственные события касания. – Omar

ответ

3

Чтобы развернуть комментарий Omar выше ... jQuery Mobile несовместим прямо сейчас с последней версией jQuery. Если вы посмотрите на jquerymobile homepage, вы увидите под кнопками загрузки (вверху справа), какие версии jQuery вы можете использовать. В настоящее время для jQM v.1.4.5 вам необходимо:

Jquery 1,8 - 1,11/2,1

 Смежные вопросы

  • Нет связанных вопросов^_^