Javascript正在挂起，需要将近2分钟来处理表单

时间：2017-05-06 21:53:26

标签： javascript

我在http://coreelectric.us/contact.php上有一个表单需要2分钟才能处理完毕。在我的本地主机上它是瞬间的。但是，当我把网站放到现场时，它需要永远。这是表单中的代码...... 

<form action="" method="post" class="form-content" id="contact-form" >
        <div class="form-container">
    <div id="thanks">Your email was sent successfully. Thank you, we will contact you soon.</div>
    <div class="input-form">
                <div class="input-left">
                                <label>*First Name :</label>
                                <input id="fname" type="text" name="fname" placeholder="Enter your first name"  />
                </div>
                <div class="input-right">
                                <label>*Last Name :</label>
                                <input id="lname" type="text" name="lname" placeholder="Enter your last name" />
                </div>
                <div class="clearfix"></div>
    </div>
    <div class="input-form">
                <div class="input-left">
                                <label>*Email :</label>
                                <input id="email" type="text" name="email"  placeholder="Enter your valid email address " />
                </div>
                <div class="input-right">
                                <label>Phone Number :</label>
                                <input id="phone" type="text" name="phone"  placeholder="Enter your phone only digit"   />
                </div>
                <div class="clearfix"></div>
    </div>
    <div class="input-form">
                <label>*Subject :</label>
                <input id="subject" type="text" name="subject"   placeholder="Subject"/>
                <div class="clearfix"></div>            
    </div>
    <div class="input-form">    
                <label>*Message :</label>
                <textarea id="message" name="message" rows="10" placeholder="Enter your message here"></textarea>
    </div>
            <div class="input-form">    
                <label>*You must authenticate:</label>
                <div style="float: left;" class="g-recaptcha" id="g-recaptcha" data-sitekey="XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX" data-callback="onReturnCallback" data-theme="light"></div>
            </div>  
            <input type="submit" style="float: right;" class="btn st-btn btn-rounded btn-primary" value="Submit" />
    <div class="error-msg"></div>
        </div>
</form>

用于处理它的javascript是...... 

<script>

    document.getElementById('phone').addEventListener('input', function (evt) {
  evt.target.value = evt.target.value.replace(/\D/g, '');
 });

$(document).on("keyup", "input.error", function(){
    phone=$('#phone').val();
    if($.isNumeric(phone)){
    $('#phone').removeClass("error");
    }
});

        $(document).ready(function(){
            $('#contact-form').submit(function(){
                $('#contact-form .error').removeClass('error');
                    $('#contact-form .error-msg').hide()
                form = true;
                elm = $(this);
                fname = $('#fname').val();
                lname = $('#lname').val();
                howhear = $('#how_hear').val();
                state = $('#state').val();
                street = $('#street').val();
                city = $('#city').val();
                zip = $('#zcode').val();
                subject = $('#subject').val();
                address = $('#address').val();
                email = $('#email').val();
                phone = $('#phone').val();
                message = $('#message').val();
                email_regex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

                if( email == ''){
                        $('#email').addClass('error');
                        form = false;

                }else if(email_regex.test(email) == false){
                        $('#email').addClass('error');
                        form = false;
                }

                if(fname==''){
                    $('#fname').addClass('error');
                    form = false;
                }

                if(lname==''){
                    $('#lname').addClass('error');
                    form = false;
                }

                if(subject==''){ 
                    $('#subject').addClass('error');
                    form = false;
                }

                if(phone==''){
                    $('#phone').addClass('error');
                    form = false;
                }
                if(howhear==''){
                    $('#how_hear').addClass('error');
                    form = false;
                }
                if(state==''){
                    $('#state').addClass('error');
                    form = false;
                }
                if(street==''){
                    $('#street').addClass('error');
                    form = false;
                }

                if(zip==''){
                    $('#zcode').addClass('error');
                    form = false;
                }
                if(address==''){
                    $('#address').addClass('error');
                    form = false;
                }
                if(city==''){
                    $('#city').addClass('error');
                    form = false;
                }
                if(howhear==''){
                    $('#how_hear').addClass('error');
                    form = false;
                }

                if(message==''){
                    $('#message').addClass('error');
                    form = false;
                }

                if(grecaptcha.getResponse() ==""){
                    $('#g-recaptcha').addClass('error');
                    $('.error-msg').html('*Captcha ').show();
                    form = false;
                }

                if(form == false){
                    $('.error-msg').html('*Please filled correctly highlighted fields').show();

                }


                if(form){
                    $.ajax({
                        url:'email.php',
                        type:'post',
                        data: $('#contact-form').serialize(),
                        success: function(res){
                            $('#thanks').show();
                            setTimeout(function() {
                            $('#thanks').fadeOut('fast');
                            }, 60000); // <-- time in milliseconds
                            $('#contact-form')[0].reset();
                        }
                    });
                }
                return false;
            });
        });
</script>

流程页面包含以下内容...... 

$fname = $_POST['fname']; 
$lname = $_POST['lname']; 
$name   = $fname."&nbsp;".$lname;
$street = $_POST['street']; 
$city = $_POST['city']; 
$zip = $_POST['zcode']; 
$address = $_POST['address']; 
$phone = $_POST['phone']; 
$email = $_POST['email']; 
$how_hear = $_POST['how_hear']; 
$newsletter = $_POST['newsletter']; 
$subject = $_POST['subject']; 
$message = $_POST['message']; 
$domain = $_SERVER['SERVER_NAME']; 


$to = "receiver@mydomain.com, ".$email;

$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
$headers .= "From:".$email . "\r\n";
$headers .= "BCC: myemail@mydomain.com, another@mydomain.com \r\n";


$txt = '<html style="background-color:#68B7F4">'
. '<div style="background-color:#FFF; padding: 10px;"><img 
src="http://coreelectric.us/images/logo.png" alt="Core Electric" >
</div>'
. '<div>An email has been received from the contact page at 
'.$domain.'. The following information was provided:<br><br></div>'
. '<table width="100%"><tr><td style="text-align: right; width: 
15%;">Name: </td><td style="text-align: left; width: 
85%;">'.$name.'</td></tr>'
. '<tr><td style="text-align: right; width: 15%;">Phone: </td><td 
style="text-align: left; width: 85%;">'.$phone.'</td></tr>'
. '<tr><td style="text-align: right; width: 15%;">Email: </td><td 
style="text-align: left; width: 85%;">'.$email.'</td></tr>'
. '<tr><td style="text-align: right; vertical-align: top; width: 
15%;">Message: </td><td style="text-align: left; width: 
85%;">'.$message.'</td></tr></table>'
. '<br><br>A representative will be in contact with you within 24 
hours.'
. '</html>';
 mail($to,$subject,$txt,$headers);

我非常感谢任何帮助，了解可能导致挂断的原因。它挂在这两行javascript之间...... 

data: $('#contact-form').serialize(),
success: function(res){

提前致谢

2 个答案:

答案 0 :(得分：0)

           if(form){
                console.log(Date.now())
                $.ajax({
                    url:'email.php',
                    type:'post',
                    data: $('#contact-form').serialize(),
                    success: function(res){
                        console.log(Date.now())
                        console.log(res)
                        $('#thanks').show();
                        setTimeout(function() {
                        $('#thanks').fadeOut('fast');
                        }, 60000); // <-- time in milliseconds
                        $('#contact-form')[0].reset();
                    },
                    error: function(error) {
                        console.log(Date.now())
                        console.log(error)
                    }
                });
            }

和php 

if(mail($to,$subject,$txt,$headers)) {
   echo "OK";
} else {
   echo "Whoops"; 
}

由此，您至少可以确定 的问题。你也可以尝试在php中删除if并尝试javascript中的错误函数不会捕获php错误。

答案 1 :(得分：0)

我在不同的服务器上运行我的原始代码，我现在在3个不同的站点上运行相同的表单，它快速闪电......将其缩小到与其他服务器的某些问题，我对此没有兴趣故障排除。我相信这个是封闭的。谢谢你的反馈。

相关问题
最新问题