一旦按下提交按钮,有没有办法延迟页面刷新?

时间:2018-04-26 15:39:51

标签: jquery

按下提交按钮后会显示一条成功消息,但是当页面刷新时它会立即消失。考虑到这一点,我想要做的是延迟页面刷新5秒左右。我尝试过使用

setTimeout(function() {location.reload();}, 5000); 

在我的代码中,但似乎无法让它工作

任何帮助都会很棒。

$("form").submit(function (e) {

        // error variable set to blank
        var error ="";
        // if subject value is equal to an empty string
        if ($("#email").val() == "")  {
            // error variable to add comment advising that data is missing
            error += "No data in email field - please complete.<br>";
        }

        if ($("#subject").val() == "")  {
            error += "No data in subject field - please complete.<br>";
        }

        if ($("#content").val() == "")  {
            error += "No data in content field - please complete.";
        }

        // if error variable is not equal to blank as error variable += html value
        if (error != "") {
            $("#errorDiv").html('<div><p><strong>Whoops! There were error(s) in the form:</p></strong><br>' + error +'</div>');
        }

        if (error != "") {
            $("#errorDiv").css("display", "block");
            return false;
        } else {
            // return true and allow submission of the submit button as no error msg as all fields have been entered correctly
            $("#successDiv").css("display", "block").html('<div><p><strong>Thank you for your enquiry, we will get back to you shortly!:</p></strong><br></div>');

            setTimeout(function() {
            location.reload();
            }, 5000);

            return true;
        }

    });

2 个答案:

答案 0 :(得分:0)

试试这个:

//declare outside your submit  
function startTimer() {
     location.reload();
}

//change your timeout func to
setTimeout(startTimer, 5000);

使用ajax进行编辑:

$('yourFormButton').on('click', function () {

    // error variable set to blank

    var error ="";
    // if subject value is equal to an empty string
    if ($("#email").val() == "")  {
        // error variable to add comment advising that data is missing
        error += "No data in email field - please complete.<br>";
    }

    if ($("#subject").val() == "")  {
        error += "No data in subject field - please complete.<br>";
    }

    if ($("#content").val() == "")  {
        error += "No data in content field - please complete.";
    }

    // if error variable is not equal to blank as error variable += html value
    if (error != "") {
        $("#errorDiv").html('<div><p><strong>Whoops! There were error(s) in the form:</p></strong><br>' + error +'</div>');
        $("#errorDiv").css("display", "block");
    } else {
    $.ajax({
        type : "GET", // or Post
        url: yourUrl,
        data:  $("form").serialize(),
        dataType : 'json',
        success : function(data) {
            setTimeout(startTimer, 5000);
        },
        error : function(data){
        }
    });
});

答案 1 :(得分:0)

尝试以下:

$("form").submit(function() {
     //your code....
     setTimeout(function() {
         window.location.reload();
      }, 5000);
   });