Блокирование кнопки на 10 секунд после нажатия

[sergofedor06]

рони


сделал так с кодом



var flag;



$('body').on('click', "#comments_add_form input[type='submit']", function (e) {
e.preventDefault();




var el = this;
if(flag)return;
else {flag = true;
el.setAttribute('disabled', 'disabled');
window.setTimeout(function() {
el.removeAttribute('disabled');
flag = false;
}, 10000)};



var user_name = $("#comments_add_form #user_name");


терь нет переадресации, но при многократном нажатии всеровно проскакивают дубли в бд

[sergofedor06]

[quote=Manyasha;429437]sergofedor06,
может так получится?

//ДОБАВИЛА
				$('.add_comment').prop('disabled', false);
            },
            error: function (response) { //Если ошибка
                alert(response);
				
				$('.add_comment').prop('disabled', false);
            }
        });
    }

    $('body').on('click', "#comments_add_form input[type='submit']", function (e) {
        e.preventDefault();
		$('.add_comment').prop('disabled', true);
		//...
    });

//ДОБАВИЛА

Ваш способ вроде как блокирует кнопку после отправки комментария
но есть проблемы он работает в том случае если человек
верно заполнил поля

имя
текст комментария
и каптчу

и нажал отправить комментарий, тогда все норм!

но если человек не верно заполнил хотя бы одно поле то при нажатии на добавить комментарий ему уже не всплывают подсказки где он сделал ошибки, так как бутон работает только одно нажатие и все, блок, еслибы ваш скрипт срабатывал только после того как пользователь верно введет данные во все поля!
а если он вводит не верно то все ровно не может отправить у меня блокировка стоит! на длину, ссылка в тексте.

[sergofedor06]

в итоге если человек ввел комментарий менее 30 знаков то ему не всплывает сообщение что нужно ввести более 30 знаков, и форма не работает так как кнопку переклинило и нужно перегружать страницу!

[Manyasha]

sergofedor06,
а так?

$('body').on('click', "#comments_add_form input[type='submit']", function (e) {
        e.preventDefault();
        var user_name = $("#comments_add_form  #user_name");
        if (user_name.val().length >= 3) {
            var comment_text = $("#comments_add_form  #comment_text");
            if (comment_text.val().length >= 30) {
                var capcha = $("#comments_add_form #capcha");
                var anchor = $("#comments_add_form  #anchor").val();
                if (user_name.val() == "") {
                    alert("введите имя");
                } else if (comment_text.val() == "") {
                    alert("введите коментарий")
                } else {
					$('.add_comment').prop('disabled', true);
                    AjaxCapchaCheck('comments.func.php', capcha.val(), anchor, 'comments_add_form');    // указать путь до файла!
                }
            } else {
                alert("минимум 30 символов");
            }
        } else {
            alert("минимум 3 символа");
        }
    });

[sergofedor06]

Manyasha

а где вы здесь добавили код, тут вроде только мой код!

[sergofedor06]

нужно чтобы работала проверка полей, а уже если все верно, и нажал на добавить комент, то уже скрипт должен не допускать повторных кликов по кнопке, вот так будет хорошо.

[sergofedor06]

у меня изначально в скрипте идет проверка всех полей на длинну и наличия ссылки в них, если человек ввел короткий комент и нажал добавить его то всплывает подсказка минимум 30 символов и так далее как видно в коде!

но если я добавляю

ваш кусок кода в свой скрипт

//ДОБАВИЛА
				$('.add_comment').prop('disabled', false);
            },
            error: function (response) { //Если ошибка
                alert(response);
				
				$('.add_comment').prop('disabled', false);
            }
        });
    }

    $('body').on('click', "#comments_add_form input[type='submit']", function (e) {
        e.preventDefault();
		$('.add_comment').prop('disabled', true);
		//...
    });

//ДОБАВИЛА

то тогда все проверки накрываются медным тазом, при клике на отправить комент, сообщение не выскакывает и комент уже не отравить кнопка заблокирована, вот я о чем!

[Manyasha]

Manyasha

а где вы здесь добавили код, тут вроде только мой код!

строка 14

[sergofedor06]

добавил

$('.add_comment').prop('disabled', true);

но все осталось как и было, проверка не работает всеровно кнопку блокирует

[Manyasha]

sergofedor06,
попробуйте так:

function AjaxCapchaCheck(url, capcha, anchor, form_id) {
        var url = url;
        var capcha = capcha;
        var page_anchor = anchor;
        var form_id = form_id;
        jQuery.ajax({
            url: url, //Адрес подгружаемой страницы
	        async: false,//ДОБАВИЛА 
            type: "POST", //Тип запроса
            data: {capcha: capcha}
            success: function (response) { //Если все нормально
                if (response == '1') {
                    AjaxFormRequest(form_id, url, page_anchor);
                } else {
                    alert('ошибка защитного кода');
                    document.images.cryptogram.src='captcha/cryptographp.php?cfg=0&&'+Math.round(Math.random(0)*1000)+1;    // указать путь до файла!
                    return false;
                }
            },
            error: function (response) { //Если ошибка
                alert(response);
            }
        });
    }

Или так:

function AjaxCapchaCheck(url, capcha, anchor, form_id) {
        var url = url;
        var capcha = capcha;
        var page_anchor = anchor;
        var form_id = form_id;
        jQuery.ajax({
            url: url, //Адрес подгружаемой страницы
            type: "POST", //Тип запроса
            data: {capcha: capcha},
			beforeSend: function(xhrObj, settings) {
				$('.add_comment').prop('disabled', true);
			},
            success: function (response) { //Если все нормально
                if (response == '1') {
                    AjaxFormRequest(form_id, url, page_anchor);
                } else {
                    alert('ошибка защитного кода');
                    document.images.cryptogram.src='captcha/cryptographp.php?cfg=0&&'+Math.round(Math.random(0)*1000)+1;    // указать путь до файла!
                    return false;
                }
            },
            error: function (response) { //Если ошибка
                alert(response);
            },
			complete: function(xhrObj, textStatus) {
				$('.add_comment').prop('disabled', false);
			}
        });
    }

весь остальной Ваш код без изменений в обоих случаях.