电子邮件提交输入清除/ css在iPhone Safari或Chrome上不起作用

问题描述

我在网站上有一个简单的email input和submit button 。 当我在web application上提交时，一切正常。 当我在我提交iOS phone ， javascript/css不适用于提交工作，如果email是有效的，但javascript/css如果电子邮件是无效的确实工作。

我已经尝试调试了一段时间！

HTML：

<input name="_replyto" placeholder="your email address">
<button id="submitBtn" value="getaccess" onclick="handleEmailSubmit()"> get access</button>

JAVASCRIPT：

function handleEmailSubmit(){
    if( validateEmail($('input').val()) ) {
        var clientEmail=$('input').val();
        console.log('sending request...')
        csrfToken = $('meta[name="csrf-token"').attr('content');  
        $('input').addClass('submitBtnFlashGreen')
        $('input').val('Got it. Thanks!')
        setTimeout(function(){
            $('input').val('');
            $('input').addClass('submitBtnUnflash')
        },800); 
        setTimeout(function(){
            $('input').removeClass('submitBtnFlashGreen');
            $('input').removeClass('submitBtnUnflash')
        },1500);      
        $('input').val('');

        $.ajax({
            type:"POST",
            url:"/signup",
            dataType:"json",
            data:{
                _csrf:csrfToken,
                email:clientEmail
            },
            success:function(response){
                console.log('done!')
            }
        });
    }else{
        $('input').addClass('submitBtnFlash')
        $('input').val('email is invalid')
        setTimeout(function(){
            $('input').val('');
            $('input').addClass('submitBtnUnflash')
        },800); 
        setTimeout(function(){
            $('input').removeClass('submitBtnFlash');
            $('input').removeClass('submitBtnUnflash')
        },1500); 
    }    
}
function validateEmail(email) {
    var re = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
    return re.test(email);
}