add a link to new page

pull/3/head
kirill 2 years ago
parent aa95400309
commit bef3d2fc94
  1. 38
      demo/templates/index.html

@ -10,11 +10,15 @@
body { body {
min-height: 100vh; min-height: 100vh;
background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%) background: linear-gradient(
90deg,
rgba(2, 0, 36, 1) 0%,
rgba(9, 9, 121, 1) 35%,
rgba(0, 212, 255, 1) 100%
);
} }
h1 { h1 {
color: white; color: white;
} }
p { p {
color: white; color: white;
@ -43,8 +47,6 @@
border-radius: 5px; border-radius: 5px;
background-color: grey; background-color: grey;
} }
</style> </style>
</head> </head>
<body> <body>
@ -53,35 +55,41 @@
<div id="root"> <div id="root">
<div class="form"> <div class="form">
<form id="myForm"> <form id="myForm">
<input type="text" id="inputText" placeholder="Введите текст"> <input type="text" id="inputText" placeholder="Введите текст" />
<div class="form__button"><button id='submit'>Отправить</button></div> <div class="form__button">
<button id="submit">Отправить</button>
</div>
</form> </form>
<div class="container_result"> <div class="container_result">
<p id="response"></p> <p id="response"></p>
</div> </div>
<div>
<a href="/index_2.html">Перейти на страницу 2</a>
</div>
</div> </div>
</div> </div>
</div> </div>
</body> </body>
<script> <script>
document.getElementById('myForm').addEventListener('submit', async function(event) { document
.getElementById("myForm")
.addEventListener("submit", async function (event) {
event.preventDefault(); // Предотвращаем отправку формы по умолчанию event.preventDefault(); // Предотвращаем отправку формы по умолчанию
const inputText = document.getElementById('inputText').value; const inputText = document.getElementById("inputText").value;
const response = await fetch('/submit', { const response = await fetch("/submit", {
method: 'POST', method: "POST",
headers: { headers: {
'Content-Type': 'application/x-www-form-urlencoded' "Content-Type": "application/x-www-form-urlencoded",
}, },
body: new URLSearchParams({ body: new URLSearchParams({
'text': inputText text: inputText,
}) }),
}); });
const responseText = await response.text(); const responseText = await response.text();
document.getElementById('response').innerText = responseText; document.getElementById("response").innerText = responseText;
}); });
</script> </script>
</html> </html>

Loading…
Cancel
Save