Как сделать родительский элемент раскрывающегося списка кликабельным с помощью переключателя? - PullRequest
Новая
       12

Как сделать родительский элемент раскрывающегося списка кликабельным с помощью переключателя?

0 голосов
/ 04 мая 2018

Прежде всего, если вы считаете, что с моим вопросом что-то не так, пожалуйста, объясните мне, что вы хотите, чтобы я изменил, чтобы сделать его лучше. Я работал над этим в течение нескольких дней с очень небольшим успехом, и я действительно стараюсь изо всех сил, но я также новичок в этой теме, поэтому, пожалуйста, будьте терпеливы со мной.

Я работаю над дочерней темой WooCommerce Storefront с Bootstrap 4.0.

Я пытаюсь использовать [плагин jQuery Smartmenus] (https://www.smartmenus.org/about/introduction-to-smartmenus-jquery/) с их надстройкой Bootstrap 4 для версии моего главного меню для небольшого экрана, потому что она поставляется с нужной кнопкой переключения. Вот как я хочу, чтобы она работала: точно так же, как их ["SmartMenus Bootstrap 4 Addon ( Навбар) "Демо" (http://vadikom.github.io/smartmenus/src/demo/bootstrap-4-navbar.html), с одним отличием: я хочу, чтобы родительский элемент был кликабельным, чтобы он приводил к ссылке, а не переключал выпадающий список. Кнопка +/- должна быть единственным раскрывающимся списком.

Мне удалось заставить кликать родительскую ссылку, используя часть ответа из этого вопроса . Я использую тот же nav walker , просто версию Bootstrap 4. В этом файле я заменил исходную строку 206 на «$ atts ['href'] =! Empty ($ item-> url)? $ Item-> url: '';" как предложено в связанном вопросе. Я не изменил CSS, и не хочу, чтобы что-то особенное происходило при наведении.

Моя проблема сейчас заключается в том, что как щелчок по родительской ссылке, так и щелчок по +/- приводят к раскрытию раскрывающегося списка на мгновение до загрузки родительской ссылки, и я перенаправлен на эту ссылку. Я бы хотел, чтобы родительская ссылка не выполняла никаких переключений, но, что более важно, мне нужна кнопка +/- для переключения выпадающего меню, а не функция ссылки на страницу родительского элемента. Как я могу заставить его переключать выпадающий список?

Я пытался удалить атрибут data-toggle и раскрывающийся класс переключения в той же части файла Walker, но это не имело никакого значения.

Вот код моего маленького экранного меню в header.php: 

<div id="small-screen-menu" class="d-block d-sm-none">
   <?php sk_smartmenus_init_in_footer(); ?>
   <nav id="xs-site-navigation" class="navbar navbar-expand-sm" role="navigation">
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#main-site-navigation" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
      </button>
      <?php
         wp_nav_menu( array(
           'theme_location'    => 'main_menu',
           'depth'             => 4,
           'container'         => 'div',
           'container_class'   => 'collapse navbar-collapse navbar-1-collapse',
           'container_id'      => 'main-site-navigation',
           'menu_class'        => 'nav navbar-nav sm sm-simple',
           'fallback_cb'       => 'WP_Bootstrap_Navwalker::fallback',
           'walker'            => new WP_Bootstrap_Navwalker(),
         ) );
      ?>                            
   </nav>
</div>

Вот соответствующие функции в functions.php: 

if ( ! function_exists( 'sk_smartmenus_init_in_footer' ) ) {
   add_action('wp_enqueue_scripts', 'sk_smartmenus_init_in_footer');
   function sk_smartmenus_init_in_footer() {
    add_action( 'print_footer_scripts', 'smartmenus_init' );
   }
}
function smartmenus_init() { 
   ?>
       <script type="text/javascript">
          $(function() {
            $('#menu-categories-menu').smartmenus();
          });
       </script>
   <?php 
}

Я действительно не уверен, что эти функции правильные. Нужно ли мне изменить содержимое файла Walker? Или Smartmenus JS? Если да, то? Я не могу понять это. Любая помощь будет оценена!

PS: Если у вас есть решение без плагина Smartmenus, которое создает интерактивный элемент меню с переключателем, я возьму его! Я не особо привязан к Smartmenus.

Обновление в декабре 2018 года: я до сих пор не понял этого. Может кто-нибудь мне помочь? Пожалуйста?

...