Как отключить кнопку возврата на определенных страницах одностраничного приложения - PullRequest
Новая
       1

Как отключить кнопку возврата на определенных страницах одностраничного приложения

0 голосов
/ 21 сентября 2018

Мое приложение имеет страницу, которая отображает детали в виде списка.При нажатии на элемент списка он перейдет на страницу, на которой отображаются соответствующие данные.

Мне нужно перейти со страницы сведений на страницу списка, используя кнопку «Назад» по умолчанию на мобильном телефоне или в браузере, но эта же кнопка «Назад» не должна работать при нажатии на нее на странице просмотра списка.

Я устал от действия кнопки «Назад» по умолчанию, добавив приведенный ниже код в JS этой страницы списка.Однако кнопка «Назад» отключена для всего приложения.

document.addEventListener("backbutton", onBackKeyDown, false);

function onBackKeyDown(e) {
  e.preventDefault();
  // alert('Back Button is Pressed!');
}

Может кто-нибудь помочь мне решить эту проблему.Заранее спасибо

Ответы [ 2 ]

0 голосов
/ 06 февраля 2019

Чтобы обработать поведение кнопки «назад» (имитация отключения), вы должны обработать навигацию и переменную, чтобы узнать, когда навигация разрешена.

Я создал страницу, чтобы показать, как она работает с кнопками возврата браузера иКнопка возврата Android.

Переменная disableBackButtonInThisPage изначально имеет значение true, поэтому навигация не разрешена.

Кнопка «Toggle disable» изменяет значение disableBackButtonInThisPage, поэтому при значении false навигация разрешается.

<!DOCTYPE html>
<html lang="en">

<head>
    <script>
        history.pushState(null, null, location.href);
        var disableBackButtonInThisPage = true;
        window.onpopstate = function () {
            if (disableBackButtonInThisPage) {
                history.go(1);
            }else{
                history.go(-1);
            }
        };
        function toggleDisable() {
            disableBackButtonInThisPage = !disableBackButtonInThisPage;
            alert("Disable back button is: " + disableBackButtonInThisPage);
        }
    </script>
</head>

<body>
    <h1>Back button demo</h1>
    <p>Click browser back button or tap Android back button.</p>
    <button onclick="toggleDisable();">Toggle disable</button>
</body>

</html>
0 голосов
/ 24 сентября 2018

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

<button data-bind="enable: pagenow()!='listpage'">Back</button>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...