考勤打卡系统：实现提交后显示JSON消息并延迟5秒刷新页面

你的需求完全可以实现，核心是先阻止表单的默认提交行为，避免页面直接刷新，再在AJAX的成功回调里完成消息展示，最后添加延迟刷新逻辑。

步骤1：阻止表单自动提交 #

有两种简单方式：

• 修改按钮的onclick事件，让它返回false以阻止默认提交：

<button type="submit" class="btn btn-success btn-xl" onclick="inserir_assid(); return false;"> <i class="pe-7s-look lnr"></i></button>

• 或者直接给表单添加onsubmit事件阻止提交：

<form name="form" method="post" action="" onsubmit="return false;">

步骤2：添加延迟刷新逻辑 #

在最内层AJAX的success回调末尾，加入setTimeout实现5秒后刷新页面：

success:function(data){
    // 保留你原有的消息展示逻辑
    if(data.length > 0 && data[0][0] == '' && data[0][1] == ''){
        var linha = ``;
        for (var i = 0; i < data.length; i++) {
            Entrada = data[i][0];
            HoraEntrada = data[i][1];
            linha += `Entrada em ${Entrada} às ${HoraEntrada}`;
        }
        $('#minhaDiv99').hide();
        $('#minhaDiv100').show();
        $(".horaentrada").html(linha);
    }else{
        var linha = ``;
        for (var i = 0; i < data.length; i++) {
            Saida = data[i][0];
            HoraSaida = data[i][1];
            linha += `Saída em ${Saida} às ${HoraSaida}`;
        }
        $('#minhaDiv99').hide();
        $('#minhaDiv101').show();
        $(".horasaida").html(linha);
    }
    // 5秒后刷新页面
    setTimeout(() => location.reload(), 5000);
}

注：原代码里的if(data[i][0] == '' && data[i][1] == '')存在i未定义的问题，上面的代码已经调整为检查第一个元素，避免报错。

内容的提问来源于stack exchange，提问作者Bruno