Jquery при нажатии (нажмите / vclick / touchstart) не работает на реальном мобильном устройстве - PullRequest
Новая
       9

Jquery при нажатии (нажмите / vclick / touchstart) не работает на реальном мобильном устройстве

0 голосов
/ 08 июня 2018

для начала Я просмотрел другие вопросы о переполнении стека, касающиеся этой проблемы, и ни один из них не помог мне.Я использую drupal 8.5.3 и jquery 3.2.1.

Проблема, с которой я сталкиваюсь, заключается в том, что нажатие кнопки «Показать мой мобильный» в меню «Показать» не вызывает событие jquery для отображения или скрытия мобильного телефона.меню.Он работает в инструментах разработчика Chrome, эмулирующих мобильное устройство, но на реальном устройстве он не работает.

Я пытался использовать события "click", "touchstart", "vclick" и "touch" и ни одно изони работали на реальном устройстве.Я также пытался использовать мобильный jquery 1.4.5 и мобильный jquery 1.5 alpha 1, ни один из которых не работал.У меня нет идей относительно того, почему он не работает на данный момент, любая помощь будет оценена.

HTML-разметка для мобильного меню: 

<ul class="menu">
    <li class="menu-item menu-item--expanded menu-item--active-trail">
        <span target="_self" class="mobile-menu-button" data-drupal-link-system-path="<front>">Menu</span>
            <ul class="menu">
                <li class="menu-item">
                    <a href="/home" target="_self" class="mobile-menu-item" data-drupal-link-system-path="node/9">Home</a>
                </li>
                <li class="menu-item menu-item--active-trail">
                    <a href="/photos" target="_self" class="mobile-menu-item is-active" data-drupal-link-system-path="node/18">Photo</a>
                </li>
                <li class="menu-item">
                    <a href="/media" target="_self" class="mobile-menu-item" data-drupal-link-system-path="node/23">Media</a>
                </li>
                <li class="menu-item">
                    <a href="/press" target="_self" class="mobile-menu-item" data-drupal-link-system-path="press">Press</a>
                </li>
                <li class="menu-item">
                    <a href="/resume" target="_self" class="mobile-menu-item" data-drupal-link-system-path="node/20">Résumé</a>
                </li>
                <li class="menu-item">
                    <a href="/contact" target="_self" class="mobile-menu-item" data-drupal-link-system-path="contact">Contact</a>
                </li>
            </ul>
    </li>
</ul>

JS нажмитепереплет: 

/**
 * @file
 * A JavaScript file for the theme.
 *
 * In order for this JavaScript to be loaded on pages, see the instructions in
 * the README.txt next to this file.
 */

// JavaScript should be made compatible with libraries other than jQuery by
// wrapping it with an "anonymous closure". See:
// - https://drupal.org/node/1446420
// - http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth
(function (Drupal, $) {
  'use strict';

  // To understand behaviors, see https://www.drupal.org/node/2269515
  Drupal.behaviors.basic = {
    attach: function (context, settings) {

      // Execute code once the DOM is ready. $(handler) not required
      // within Drupal.behaviors.
      $(window).on('load', function () {
        // Execute code once the window is fully loaded.
        $(".mobile-menu-button").parent().once().on("click", function() {
          $(".mobile-menu-button").parent().find(".menu").toggle();
        });
      });

      $(window).on('resize', function () {
        // Execute code when the window is resized.
      });

      $(window).on('scroll', function () {
        // Execute code when the window scrolls.
      });

    }
  };

})(Drupal, jQuery);

1 Ответ

0 голосов
/ 10 августа 2018

В вашем собственном [module / theme] .libraries.yml вы должны установить ui, mouse как зависимость вашей библиотеки: 

dependencies:
  - core/jquery.ui.mouse
...