Выпадающее меню должно свернуться при щелчке по ссылке

Question

В моей навигационной панели я использовал HEADING, PARAGRAPH и LINKS в выпадающем меню. При нажатии LINK, раскрывающееся меню рухнет как его поведение по умолчанию, это нормально. Но когда я нажимаю на HEADING, PARAGRAPH или ANYWHERE в раскрывающемся списке, выпадающее меню должно отображаться. Есть несколько длинных абзацев, которые пользователи предпочитают выбирать для чтения или копирования.

JSFiddle Demo

                                   <div class="row">
                                      <div class="col dd-meta">
                                       <h5>Our Organization</h5>
                                       <p>Our story, mission, team and more</p>
                                       <a class="link-meta" href="javascript:;">Know more about us</a>
                                      </div>

                                      <div class="col dd-meta">
                                        <ul class="link-common">
                                          <li><a href="javascript:;">Action</a></li>
                                          <li><a href="javascript:;">Action</a></li>
                                          <li><a href="javascript:;">Action</a></li>
                                          <li><a href="javascript:;">Action</a></li>
                                        </ul>
                                      </div>

                                      <div class="col dd-meta">
                                       <h5>Our Organization</h5>
                                       <p>Our story, mission, team and more</p>
                                       <a class="link-meta" href="javascript:;">Know more about us</a>
                                      </div>

                                    </div>

Answer 1

Можно проверить, является ли нажатие элемента beign ссылкой, в противном случае остановить распространение события, чтобы предотвратить запуск раскрывающихся событий:

$('.nav-item').on('click', function(e) {
  if ($(e.target).is(':not(a)')) {
    e.stopPropagation();
  }
})

Это может вызвать проблемы, если вы зависите от событий, распространяющихся для других поведение.