Для избежания повторной отправки формы при использовании ajax запроса можно использовать флаг, который будет устанавливаться перед отправкой запроса и сбрасываться после получения ответа от сервера. Например, предположим, что у вас есть кнопка с id "submitBtn" и форма с id "myForm":
```javascript
let formIsSubmitted = false;
$('#submitBtn').click(function(e) {
e.preventDefault();
if (formIsSubmitted) {
return;
}
formIsSubmitted = true;
// отправка ajax запроса
$.ajax({
url: 'your-url',
type: 'POST',
data: $('#myForm').serialize(),
success: function(response) {
// обработка успешного ответа
formIsSubmitted = false;
},
error: function(error) {
formIsSubmitted = false;
}
});
});
```
Чтобы обеспечить блокировку формы после успешной отправки данных на определенное время, можно использовать функцию setTimeout() для автоматического разблокирования кнопки отправки через определенное количество времени. Например:
```javascript
$('#submitBtn').click(function(e) {
e.preventDefault();
if (formIsSubmitted) {
return;
}
formIsSubmitted = true;
$(this).prop('disabled', true);
// отправка ajax запроса
$.ajax({
url: 'your-url',
type: 'POST',
data: $('#myForm').serialize(),
success: function(response) {
// обработка успешного ответа
setTimeout(function() {
$('#submitBtn').prop('disabled', false);
}, 3000);
formIsSubmitted = false;
},
error: function(error) {
formIsSubmitted = false;
$('#submitBtn').prop('disabled', false);
}
});
});
```
В этом примере кнопка отправки формы блокируется после ее отправки, затем через 3 секунды разблокируется после успешного ответа от сервера.