Пожар при поступлении на страницу с якорем

Question

Мой вопрос немного похож на этот , но не совсем такой.

У меня есть страница с привязкой, например.page.html#video1.На этой странице у меня есть несколько разделов с идентификаторами, т.е.#video1, #video2.Каждый раздел содержит статью и кнопку, которая показывает видео.

Я хочу, чтобы видео в разделе #video1 отображалось автоматически при достижении page.html#video1.Это возможно с Javascript или jQuery?

<div id="video_container"></div>
<div id="video"></div>

<section id="video1">
  <p>
    article 1
  </p>
  <button class="video1">
   the button that plays the video1
  </button>
</section>

<section id="video2">
  <p>
    article 2
  </p>
  <button class="video2">
   the button that plays the video2
  </button>
</section>

$('.video1').click(function() {
  $("#video_container").html('<div id="video"><iframe id="portrait_video" class="video_fonc" src="https://www.youtube.com/embed/0itBZI6PiDc?rel=0&enablejsapi=1&version=3&playerapiid=ytplayer&autoplay=1&enablejsapi=1&modestbranding=1" frameborder="0" allowfullscreen ></iframe></div>').fadeIn(400);
  $("#video").fitVids();
});

$('.video2').click(function() {
  $("#video_container").html('<div id="video"><iframe id="portrait_video" class="video_fonc" src="https://www.youtube.com/embed/0itBZI6PiDc?rel=0&enablejsapi=1&version=3&playerapiid=ytplayer&autoplay=1&enablejsapi=1&modestbranding=1" frameborder="0" allowfullscreen ></iframe></div>').fadeIn(400);
  $("#video").fitVids();
});

Вот jsFiddle

Answer 1

Вы можете получить фрагмент из URL, используя window.location.hash.В вашем случае это значение будет соответствовать id из section, содержащему кнопку, так что вы можете просто найти соответствующие button и trigger() щелчок по ней:

var hash = window.location.hash;
if (hash) {
  $('section#' + hash).find('button').trigger('click');
}