Go back button on html page |
Go back button on html page |
rzaruvne |
Apr 10 2024, 09:04 AM
Post
#1
|
Group: Members Posts: 1 Joined: 10-April 24 Member No.: 29,163 |
I want to add a button next to the "Inciar" button so that when the user clicks, it returns to the last div page visited. I've tried but without success, seems to work only to go back to main page content.
CODE <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Calculadora de movimentação de rede</title> <style> body { display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; } main { text-align: center; } .page { display: none; } .page.active { display: block; } button { background-color: #4CAF50; /* Green shade */ border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer; border-radius: 8px; } button:hover { background-color: #45a049; /* Darker green shade on hover */ } </style> </head> <body> <main> <h1>Calculadora de movimentação de rede</h1> <button onclick="showPage('Prestador')">Iniciar</button> <div id="Prestador" class="page"> <h2>Para qual tipo de prestador deseja realizar a movimentação?</h2> <button onclick="showPage('Hospitalar')">Hospitalar</button> <button onclick="showPage('Não Hospitalar')">Não Hospitalar</button> </div> <div id="Hospitalar" class="page"> <h2>Qual tipo de movimentação deseja realizar?</h2> <button onclick="showPage('HI')">Inclusão</button> <button onclick="showPage('HE')">Exclusão</button> <button onclick="showPage('HA')">Alteração</button> <button onclick="showPage('HV')">Vinculação</button> </div> <div id="Não Hospitalar" class="page"> <h2>Qual tipo de movimentação deseja realizar?</h2> <button onclick="showPage('NHI')">Inclusão</button> <button onclick="showPage('NHE')">Exclusão</button> <button onclick="showPage('NHA')">Alteração</button> <button onclick="showPage('NHV')">Vinculação</button> </div> <div id="HI" class="page"> <h2>O prestador é rede direta?</h2> <button onclick="showPage('')">Sim</button> <button onclick="showPage('')">Não</button> </div> </main> <script> function showPage(pageId) { var pages = document.querySelectorAll('.page'); pages.forEach(page => { if (page.id === pageId) { page.classList.add('active'); lastVisitedPageId = pageId; // Update lastVisitedPageId } else { page.classList.remove('active'); } }); } </script> </body> </html> |
Lo-Fi Version | Time is now: 20th May 2024 - 07:34 AM |