在表单上遇到错误时关闭加载动画 - Turn off loading animation when encountering error on form

Turn off loading animation when encountering error on form

我有一个简单的电子邮件表单，当点击提交时，它会打开加载动画（jQuery）：

onClick="$('.loader').css('visibility', 'visible');

jQuery 表单处理程序将 ajax 数据发送到 PHP 邮件文件进行处理和错误检查，从而关闭动画：

if(trim($name) == 'Name *') {
exit('<div class="error_message">You must enter your name.</div>
<style type="text/css">.loader { visibility: hidden !important; }</style>');

工作一种待遇，但仅在第一个表单错误上。任何后续错误都不会打开/关闭加载程序。

不明白为什么如果 PHP 脚本将可见性属性更改为隐藏，为什么该属性无法恢复为可见，因为每次点击提交按钮时，加载器都应该是可见的！我承认自己是PHP菜鸟，所以请不要敲打我的分数。

或者，您可以先收集所有错误，然后结束，最后将它们全部合并，然后退出它：

$errors = array(); // an array that will hold the errors
// errors, push them inside the container
if(trim($name) == 'Name *') $errors[] = '<div class="error_message">You must enter your name.</div>';
if(trim($email) == 'Email something') $errors[] = '<div class="error_message">You must enter your email.</div>';
if(!empty($errors)) { // if there are errors
    // add the style on the first position
    array_unshift($errors, '<style type="text/css">.loader { visibility: hidden !important; }</style>');
    echo implode("'n", $errors); // join them all
    exit;
}

感谢 Ghost，在 jQuery AJAX 调用上的成功函数上使用加载器可见性属性起作用。我把它放在PHP服务器端，它不会更新页面。

$.post(action, {
        name: $('#name').val(),
        email: $('#email').val(),
        phone: $('#phone').val(),
        comments: $('#comments').val()
    },
        function(data){
            document.getElementById('message').innerHTML = data;
            $('#message').fadeIn(200);
            $('.hide').hide(0);
            $('#submit').removeAttr('disabled');
            if (data != '') {
                $('.loader').css('visibility','hidden'); //hide the loader animation on error
}