При нажатии (ссылка) HREF прокрутите к началу страницы в Angular JS - PullRequest
0 голосов
/ 11 марта 2019

У меня есть страница со ссылками (нет доступа к редактированию ссылок).

Ссылка на событие в качестве идентификатора в конце ссылки. (Например) https://test.com/PageCatalog.aspx?Pcat=16

Ранее приведенный ниже jquery работал бы без проблем. Я захватил URL-адрес и разделил его точно на = и захватил идентификатор категории, и если я был так, я использовал для отправки прокрутки вверх.

<script type="text/javascript">

    $(document).ready(function() {

        var url = window.location.href;
        var maid = url.split("=").pop();

        if (maid == 53) {
            $("html,body").animate({scrollTop: 10}, 1000);
        }

    });

</script>

Но теперь вся работа с фреймами была обновлена ​​до Angular JS, и вышеописанное не работает. Я попробовал несколько вещей, но не смог этого сделать.

Нужна ваша помощь, чтобы добиться этого в Angularjs.

1 Ответ

0 голосов
/ 11 марта 2019

Хорошо. Давайте попробуем разные подходы и дайте мне знать, помог ли вам какой-либо из них:

Метод jQuery scrollTop ()

Метод scrollTop () вернет значение высоты, которое вы можете использовать позже.

var height =  $(window).scrollTop();

Метод jQuery animate ()

Иногда из-за различий в некоторых браузерах вы обнаруживаете, что браузеры не отвечают только на объект окна, html или тело:

$(window).scrollTop();
$('html').scrollTop();
$('body').scrollTop();

Таким образом, можно обойтись без анимации, затрагивающей html и body:

  $('html, body').animate({scrollTop: 0} , 0);

Первый атрибут указывает, какое свойство изменить. Второй атрибут указывает, насколько быстрее вы должны его изменить.

Чистый JavaScript

window.scrollTo(0,0);

Использование якоря + jQuery

Создать якорь:

<a id="top"></a>

Прокрутите до него:

var topTag = $("a[name='top']");
$('html,body').animate({scrollTop: topTag.offset().top}, 0);

Использование якоря + HREF

Создать якорь:

<a id="top"></a>

Затем перейдите к нему, нажав на ссылку:

<a href="#top">Go to Top</a>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...