Перенаправление после отправки со счетчиком
Я пытаюсь перенаправить счетчик на другую страницу. Я хочу, чтобы перенаправление началось, когда я отправлю форму. Я хочу перенаправить на другую страницу после отправки формы.
var count = 6;
var redirect = "https://www.google.com";
function countDown() {
var timer = document.getElementById("timer");
if (count > 0) {
count--;
timer.innerHTML = "This page will redirect in " + count + " seconds.";
setTimeout("countDown()", 1000);
} else {
window.location.href = redirect;
}
}<form method = "post">
<p>
<label>Name
<input type = "text" name = "textfield">
</label>
</p>
<p>
<input type = "submit" name = "Submit" value = "Submit"><br>
</form>
<span id = "timer">
<script type = "text/javascript">countDown();</script>
</span>
</p>я хочу, чтобы перенаправление отображалось после отправки формы. например, если я ввожу имя, затем нажимаю «Отправить», затем происходит перенаправление. вместо перенаправления, когда вы не заполнили и не отправили форму
Извините, это не имеет особого смысла.
Как отправляется ваша форма?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Вы можете получить счетчик, используя setInterval и выполняя проверку до тех пор, пока он не достигнет 0 для перенаправления:
<form method = "post">
<p>
<label>Name
<input type = "text" name = "textfield">
</label>
</p>
<p>
<input type = "submit" name = "Submit" value = "Submit">
<br>
</form>
<span id = "timer">This page will redirect in <span id = "count"></span> second(s).</span>
<script type = "text/javascript">
var count = 6;
var redirect = "https://www.google.com";
var elem = document.getElementById('count');
elem.innerText = count
setInterval(() => {
count--
elem.innerText = count
if (count == 0) {
window.location.href = redirect;
}
}, 1000)
</script>это то же самое. я хочу, чтобы перенаправление отображалось после отправки формы. например, если я ввожу имя, нажмите «Отправить», затем приходит перенаправление. вместо перенаправления, когда вы не заполнили и не отправили форму
Отправка формы вызовет запрос на ваш сервер, поэтому вы не сможете вызвать перенаправление после отправки формы.
я понимаю. Ok
Отправка формы всегда является запросом к серверу. Вы можете либо использовать ajax для отправки формы, либо вы можете просто подсчитать и отправить форму позже.
Чтобы ваша форма не отправлялась, когда пользователь нажимает кнопку, вы можете предотвратить поведение по умолчанию следующим образом:
$('input [type=submit]').on('click', function( event ) {
event.preventDefault();
// use your counter here
// when counter hits 0 just submit the form with
$('form').submit();
});
или используйте вызов ajax:
$('form').on('submit', function(event) {
event.preventDefault();
$.ajax({
url: 'url/to/form/action',
data: $(this).serialize(),
method: "POST",
success: function() {
// start your counter
// REDIRECT
}
});
});
Проблема с первым методом заключается в том, что вы просто задерживаете отправку формы. Во втором случае вы не можете достоверно сказать, когда вы получите успешный (или ошибочный) ответ, поскольку вызов асинхронный. Это приведет либо к задержке перед запуском вашего счетчика, либо к возможной задержке после окончания вашего счетчика, если сервер не ответил до этого момента.
Непонятно, что вы пытаетесь сделать. Если вы хотите отправить, когда форма отправлена, в чем смысл (сломанного) счетчика?