Question

我有这个简单的脚本验证一些输入并显示错误消息。这是我的JSFiddle http://jsfiddle.net/2kJVU/

加载DOM，嵌入脚本。代码部分工作，但电子邮件始终显示在我的网站上，即使电子邮件字段填写正确。这是我的JS：

$(document).ready(function(){
    $('#registreren').click(function(){  
        var Email = $('#Email').val();
        var Postcode =$('#Postcode').val();

        $("#add_err2").html("");

        if(Email == "") {
            $("#add_err2").css({"border-radius":"5px", "background":"#fd7777", "border":"1px solid #ff0000"});
            $("#add_err2").html("Vul a.u.b. een E-mail adres in <br>");
        }
        else if(!validateEmail(Email)){
            //$("#add_err2").css({"border-radius":"5px", "background":"#ff4e4e", "border":"1px solid #ff0000"});
            $("#add_err2").append("Vul a.u.b. een geldig E-mail adres in <br>");
        }

        if(Postcode == "") {
            //$("#add_err2").css({"border-radius":"5px", "background":"#ff4e4e", "border":"1px solid #ff0000"});
            $("#add_err2").append("Vul a.u.b. een Postcode in <br>");
        }
        else if(Postcode.length < 4){
            //$("#add_err2").css({"border-radius":"5px", "background":"ff4e4e", "border":"1px solid #ff0000"});
            $("#add_err2").append("Vul a.u.b. een geldige Postcode in <br>");
        } else {
            // send backend service;
            $.ajax({
                type: "POST",
                url: "./postcodecheck.php",
                data: "registreren=true&Email="+Email+"&Postcode="+Postcode,
                success: function(html){    
                    if(html=='true')    {
                        $("#add_err2").hide();
                        window.location="./registreren.php";
                    }
                    else    {
                        $("#add_err2").css({"border-radius":"5px", "background":"#496999", "border":"1px solid #174385", "width":"350px;", "color":"#ffffff"});
                        $("#add_err2").html("Helaas is BoxCloud nog niet beschikbaar in uw regio. Als u op de hoogte wilt blijven van nieuwe regio’s, meld u dan a.u.b. via de onderstaande balk aan voor de nieuwsbrief van BoxCloud");
                    }
                },
            });
            function validateEmail(email) {
                var re = /^(([^<>()[\]\\.,;:\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,}))$/;
                return re.test(email);
            }
            return false;
        };
    });
});

HTML：

<form id="klant_worden" action="" method="POST">
    <fieldset id="inputs">
        <input id="Email" type="email" name="Email" class="inputs" placeholder="Uw e-mail adres">
        <input id="Postcode" type="text" name="Postcode" class="inputs" placeholder="Uw postcode (1234AB)">
        <!-- <input type="submit" class="submitclient" id="registreren" value="Registreren" name="registreren" onclick="validateForm();"> -->
        <input type="button" class="submitclient" id="registreren" value="Registreren" name="registreren">
    </fieldset>
</form>

<section class="err" id="add_err2"><br></section>

这在那里工作正常，但不在我的服务器上。为什么呢？

编辑：

可以在这里找到实时版本（第一个注册框）： http://www.boxcloud.nl/site/

Answer 1

验证电子邮件应该在else循环之外：http://jsfiddle.net/2kJVU/3/

$(document).ready(function () {
    $('#registreren').click(function () {
        var Email = $('#Email').val();
        var Postcode = $('#Postcode').val();

        $("#add_err2").html("");

        if (Email === "") {
            $("#add_err2").css({
                "border-radius": "5px",
                    "background": "#fd7777",
                    "border": "1px solid #ff0000"
            });
            $("#add_err2").html("Vul a.u.b. een E-mail adres in <br>");
        } else if (!validateEmail(Email)) {

            $("#add_err2").append("Vul a.u.b. een geldig E-mail adres in <br>");
        }

        if (Postcode === "") {
            $("#add_err2").append("Vul a.u.b. een Postcode in <br>");
        } else if (Postcode.length < 4) {
            $("#add_err2").append("Vul a.u.b. een geldige Postcode in <br>");
        } else {
            // send backend service;
            $.ajax({
                type: "POST",
                url: "./postcodecheck.php",
                data: "registreren=true&Email=" + Email + "&Postcode=" + Postcode,
                success: function (html) {
                    if (html == 'true') {
                        $("#add_err2").hide();
                        window.location = "./registreren.php";
                    } else {
                        $("#add_err2").css({
                            "border-radius": "5px",
                                "background": "#496999",
                                "border": "1px solid #174385",
                                "width": "350px;",
                                "color": "#ffffff"
                        });
                        $("#add_err2").html("Helaas is BoxCloud nog niet beschikbaar in uw regio. Als u op de hoogte wilt blijven van nieuwe regio’s, meld u dan a.u.b. via de onderstaande balk aan voor de nieuwsbrief van BoxCloud");
                    }
                }
            });


        }
    });

    function validateEmail(email) {
        var re = /^(([^<>()[\]\\.,;:\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,}))$/;
        return re.test(email);
    }


});

JQuery在jsfiddle上工作但不在我的服务器上

1 个答案: