как временно перенаправить на одну страницу перед переходом на другую по нажатию кнопки - PullRequest
0 голосов
/ 23 февраля 2020

Я работаю над сайтом для клиента. для бэкэнда я использую Django. На веб-странице есть кнопка, которая при нажатии загружает другую страницу. Но клиент хочет, чтобы программа была такой, чтобы при нажатии кнопки сначала загружалась другая страница, а затем загружалась исходная страница.

Например, предположим, что страница с кнопкой имеет значение PAGE A целевая страница - PAGE B, а временная страница - PAGE C.

. При нажатии кнопки URL-адрес должен сначала измениться на PAGE C, а затем должен быть загружен PAGE B.

Не уверен, почему мой клиент хотел бы этого, но они хотят. Я посмотрел на этот код

<meta http-equiv="refresh" content="0; URL=the_webpage_to_be_loaded"/>

Этот код перенаправляет страницу на целевую страницу сразу же на странице refre sh. Вместо этого это должно происходить только при нажатии кнопки и только на мгновение.

Это код для кнопки

<a href="{% url 'redirect_page_1' %}" class="btn btn-lg mb-5 redirect_submit">redirect on click</a>

1 Ответ

0 голосов
/ 24 февраля 2020

Для этого есть решение javascript, для демонстрации я создал 3 html файлов.

  1. index. html => initial html. (в вашем случае a. html)
  2. b. html => Здесь страница загружается в течение се c, а затем перенаправляется на c. html
  3. c. html => Это последняя страница

index. html файл

<body>
  <h2>This is the first html</h2>
  <div>
    <button type="button" onclick="goTo()">Go to html 3</button>
  </div>
</body>
<script>
  function goTo(){
    window.location.replace('b.html?q=c.html')
  }
</script>

b. html файл

<body>
    <h2>This is the second html</h2>
</body>
<script>
    document.addEventListener("DOMContentLoaded", function(){
        var url_string = window.location.href;
        var url = new URL(url_string);
        var redirectUrl = url.searchParams.get("q");
        setTimeout(function(){
            window.location.replace(redirectUrl)
        },1000)
    });
</script>

c. html файл

<body>
    <h2>this is the third html</h2>
</body>

Вот что он на самом деле делает, при нажатии кнопки мы вызываем функцию, и функция перенаправляется на временную html файл (b. html) с параметром запроса, на который URL должен перенаправляться с b.html.

В b.html есть функция javascript, которая вызывается после загрузки страницы, и она получит параметры запроса из URL, а затем перенаправит на URL параметров, в этом случае c.html.

Попробуйте создать 3 html файлов и дайте мне знать, если это решено. :)

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