Question

我已经使用php和jquery和sql创建了订阅表单来存储数据。

现在它工作正常，但它有一些限制。

当我输入无效的电子邮件地址时，它会显示如下，

enter image description here

但我需要删除该消息，我只需要使用错误按钮的工作效果。

如果我输入空白，那个时间错误按钮工作正常[按钮会动摇并说错误]，之后我输入有效地址，它也工作正常[即成功按钮]。

还有一个想法，如果我先输入无效地址，第二个也输入无效地址，错误按钮只能在第一时间正常工作。

这是lib.js：

$(document).ready(function () { 
    $('#newsletter').submit(function () { 
        var $this = $(this), 
        $response = $('#response'), 
        $mail = $('#signup-email'), 
        testmail = /^[^0-9][A-z0-9._%+-]+([.][A-z0-9_]+)*[@][A-z0-9_]+([.][A-z0-9_]+)*[.][A-z]{2,4}$/, 
        hasError = false; 

        $response.find('p').remove(); 

        if (!testmail.test($mail.val())) {
            $('#actbtn').removeClass('btn-error').addClass('btn-error');
            //$response.html('<p class="error">Please enter a valid email</p>'); 
            hasError = true; 
        } 

        if (hasError === false) { 
            $response.find('p').remove(); 
            $response.addClass('loading'); 

            $.ajax({ 
                type: "POST", 
                dataType: 'json', 
                cache: false, 
                url: $this.attr('action'), 
                data: $this.serialize(),
                success: function(data){
                    if(data!=''){
                        $response.removeClass('loading'); 
                        if(data.status == 'success'){
                            $('#actbtn').removeClass('btn-error').addClass('btn-success');
                        }
                        else{
                            $('#actbtn').removeClass('btn-error').addClass('btn-error');
                        }
                    }
                }           
            });
        } 

        return false; 
    }); 
});

HTML：

        <div id="newsletterform">
            <div class="wrap">
                <h3>Get Email Update</h3>
                <form action="send.php" method="post" id="newsletter" name="newsletter">
                    <input type="email" name="signup-email" id="signup-email" value="" placeholder="Insert email here" />
<button id="actbtn" class="btn btn-7 btn-7h icon-envelope">Submit form</button>
                    <span class="arrow"></span>
                </form>
                <div id="response"></div>
            </div>
        </div>

我可以知道，如何实现这一目标，任何想法都会受到高度赞赏。

提前致谢。

Answer 1

您已使用

<input type="email" name="signup-email" id="signup-email" value="" placeholder="Insert email here" />

尝试将其用作输入文本，因为您进行了脚本验证

<input type="text" name="signup-email" id="signup-email" value="" placeholder="Insert email here" />

当我在jquery中以订阅形式输入重复的无效电子邮件或空白条目时设置错误按钮

1 个答案: