Modify scrollTop

问题描述 投票:-1回答:1

我正在与此行一起使用标准JavaScript:

if (($messageSuccess.offset().top - 80) < $(window).scrollTop()) {
  $('html, body').animate({
    scrollTop: $messageSuccess.offset().top - 80
  }, 300);
}

[我试图在两秒钟后将$messageSuccess恢复到其原始位置,但无论如何我都找不到。

它似乎不起作用...我想代码中肯定还有其他东西会引起麻烦。

这是与联系表相关的代码:

$('.contact-form').each(function(){
        $(this).validate({
            submitHandler: function(form) {

                var $form = $(form),
                    $messageSuccess = $form.find('.contact-form-success'),
                    $messageError = $form.find('.contact-form-error'),
                    $submitButton = $(this.submitButton),
                    $errorMessage = $form.find('.mail-error-message'),
                    submitButtonText = $submitButton.val();

                $submitButton.val( $submitButton.data('loading-text') ? $submitButton.data('loading-text') : 'Cargando...' ).attr('disabled', true);

                // Fields Data
                var formData = $form.serializeArray(),
                    data = {
                        textSample: $form.find('#textSample').val(),
                        selectSample: $form.find('#selectSample').val()
                    };

                $(formData).each(function(index, obj){
                    data[obj.name] = obj.value;
                });

                // Google Recaptcha v2
                if( data["g-recaptcha-response"] != undefined ) {
                    data["g-recaptcha-response"] = $form.find('#g-recaptcha-response').val();
                }

                // Ajax Submit
                $.ajax({
                    type: 'POST',
                    url: $form.attr('action'),
                    data: data
                }).always(function(data, textStatus, jqXHR) {

                    $errorMessage.empty().hide();

                    if (data.response == 'success') {

                        // Uncomment the code below to redirect for a thank you page
                        // self.location = 'thank-you.html';

                        $messageSuccess.removeClass('d-none');
                        $messageError.addClass('d-none');

                        // Reset Form
                        $form.find('.form-control')
                            .val('')
                            .blur()
                            .parent()
                            .removeClass('has-success')
                            .removeClass('has-danger')
                            .find('label.error')
                            .remove();


                        $form.find('.form-control').removeClass('error');

                        $submitButton.val( submitButtonText ).attr('disabled', false);

                        return;

                    } else if (data.response == 'error' && typeof data.errorMessage !== 'undefined') {
                        $errorMessage.html(data.errorMessage).show();
                    } else {
                        $errorMessage.html(data.responseText).show();
                    }

                    $messageError.removeClass('d-none');
                    $messageSuccess.addClass('d-none');

                    if (($messageError.offset().top - 80) < $(window).scrollTop()) {
                        $('html, body').animate({
                            scrollTop: $messageError.offset().top - 80
                        }, 300);
                    }

                    $form.find('.has-success')
                        .removeClass('has-success');

                    $submitButton.val( submitButtonText ).attr('disabled', false);

                });
            }
        });
    });
javascript jquery offset scrollto
1个回答
0
投票

您需要的是setTimeout功能

 if (($messageSuccess.offset().top - 80) < $(window).scrollTop()) {
   setTimeout(function(){
         $('html, body').animate({
            scrollTop: $messageSuccess.offset().top - 80
           }, 300)
          },2000);
  }

2秒后,它将执行您的animate

© www.soinside.com 2019 - 2024. All rights reserved.