Извлечь хеш или страницу

Мне нужно отредактировать код ниже. Теперь он хорошо работает для якорей в url-адресе (www.mypage.com/#contact). Мне нужно изменить этот код, чтобы сохранить его в переменной var target, как показано в следующем примере:

www.mypage.com/#contact> target = contact

www.mypage.com/page.html> target = page

www.mypage.com/page.html#contact> target = contact

$('a.js-scroll-trigger[href* = "#"]').click(function() {
    if (location.pathname.replace(/^//, '') == this.pathname.replace(/^//, '') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
      if (target.length) {
        $('html, body').animate({
          scrollTop: (target.offset().top - 70)
        }, 1000, "easeInOutExpo");
        return false;
      }
    }
});

Спасибо за помощь.

как насчет: www.mypage.com, и www.mypage.com/target, и www.mypage.com/target/, и www.mypage.com#, и www.mypage.com/#, и www.mypage.com/page.html#?

— 15.10.2018 19:43

так в чем проблема?

— 15.10.2018 21:28

jquery url hash

15.10.2018 19:41

Как конвертировать HTML в PDF с помощью jsPDF

В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

В моем примере ниже я определяю переменную, которая содержит либо hash (без "#"), либо pathname (без расширения файла). Затем результирующее значение проверяется на предмет существования элемента с этим id или name. Если элемент существует, прокрутите до него.

$('a.js-scroll-trigger').click(function(e) {
  e.preventDefault();

  // get the hash (without #) or filename (without extension)
  var s = this.hash.substr(1) || this.pathname.match(/([^/]+)(?=\.\w+$)/)[0];
  console.info(s);

  // test for an existing element that has matching ID or NAME.
  var $target = $("#" + s).length ? $("#" + s) : $('[name=' + s + ']');

  // if that element exists, scroll to it
  if ($target.length) {
    $('html, body').animate({
      scrollTop: ($target.offset().top - 70)
    }, 1000);
  }

});

a {
  display: block;
}

#contents {
  margin-top: 150vh;
}

#contents div {
  height: 100vh;
}

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<a class = "js-scroll-trigger" href = "https://www.mypage.com/#contact">www.mypage.com/#contact</a>
<a class = "js-scroll-trigger" href = "https://www.mypage.com/page.html">www.mypage.com/page.html</a>
<a class = "js-scroll-trigger" href = "https://www.mypage.com/page.html#contact">www.mypage.com/page.html#contact</a>

<div id = "contents">
  <div id = "contact">
    CONTACT
  </div>
  <div name = "page">
    PAGE
  </div>
</div>

Спасибо. Ваш код и меню data-href i решили мою проблему.

— 18.10.2018 17:32

15.10.2018 21:58