表单输入值验证

时间:2015-05-16 10:56:20

标签: javascript validation contact-form

我对联系表单有疑问。 javascript我不擅长。我们在这里回答问题。

我的网站上有一个联系表单,其中一个名为security的字段用于反垃圾邮件发送者目的。目前,所有字段(security除外)都将由javascript验证,我来自其他地方。并且,security的字段将在提交时由php代码验证。安全领域是一个数学问题。如果您已完成所有其他字段,但提供了对安全字段的错误答案,则您将被重定向到表单并被要求重新执行此操作。我不希望表格是这样的。

这里测试表格 - > http://www.jornes.com

我想要的是,如果数学问题的答案是50,访问者只能通过验证并提交正确答案的表格。我希望javascript验证此值。

我正在寻找一种解决方案,使联系表格变得更好。任何解决方案?

以下是处理现有表单的JavaScript。

function validateForm(){
    // set some vars
    var name = document.getElementById('name');
    var phone = document.getElementById('phone');
    var email = document.getElementById('email');
    var location = document.getElementById('location');
    var findus = document.getElementById('findus');
    var inquiry = document.getElementById('inquiry');
    var msg = '';

    if(name.value.length == ''){
        msg+= '*How shall i address you? \n';
        name.className = 'inpBoxError';
    }

    else if(name.value.length < 3){
        msg+= '-Your name is too short, my friend! \n';
        name.className = 'inpBoxError';
    }

    else if((name.value.length<3)||(/[^a-z\s\'\-\.]/gi.test(name.value))) { // invalid - must be minimum of 5 character only
        msg+= '-Please enter your name with words only! \n';
        name.className = 'inpBoxError';
    }

    else if ((phone.value.length == '')) { 
        msg+= '*You should have a cell phone, i guess?! \n';
        phone.className = 'inpBoxError';
    }



    else if ((phone.value.length<1)||(/[^0-9]/gi.test(phone.value))) { // invalid - must be minimum of 10 digits only
        msg+= '-Only Numeric for Phone Field!(Ex:0123456789) \n';
        phone.className = 'inpBoxError';
    }

    else if ((phone.value.length<10)||(/[^0-9]/gi.test(phone.value))) { // invalid - must be minimum of 10 digits only
        msg+= '-Please enter a valid phone number! "10 digits" \n';
        phone.className = 'inpBoxError';
    }

    else if ((email.value.length == '')) { 
        msg+= '*Email is also a good way for us to communicate. \n';
        email.className = 'inpBoxError';
    }

    else if(!/^([a-z0-9])([\w\.\-\+])+([a-z0-9]?)\@((\w)([\w\-]?)+\.)+([a-z]{2,4})$/i.test(email.value)) { // invalid
        msg+= '-Invalid email format! \n';
        email.className = 'inpBoxError';
    }

    else if(location.value.length == ''){
        msg+= '*Please tell me where are you from! \n';
        location.className = 'inpBoxError';
    }

    else if(location.value.length < 5){
        msg+= '-Location name is too short! I am not sure where is the place. \n';
        location.className = 'inpBoxError';
    }

    else if(purpose.value == ''){
        msg+= '*You contact me for...? \n';
        purpose.className = 'multipleError';
    }

    else if(findus.value == ''){
        msg+= '*How did you find me? Did i know you? \n';
        findus.className = 'inpSelectError';
    }

    else if(inquiry.value.length == ''){
        msg+= '*At least tell me something! \n';
        inquiry.className = 'messageBoxError';
    }

    else if(inquiry.value.length < 50){
        msg+= '-Your message is too short! "Minimum 50 characters." \n';
        inquiry.className = 'messageBoxError';
    }

    else if(security.value == ''){
        msg+= '*You must provide correct answer to submit this form! \n';
        security.className = 'inpBoxError';
    }

    // SUbmit form part
    if(msg == ''){
        return true;
    }else{
        alert(msg);
        return false;
    }

}

1 个答案:

答案 0 :(得分:0)

即使是最愚蠢的僵尸程序也可以解析安全问题:7 + 3也许您想要使用文字或图像。

您可以使用正则表达式来验证安全表单字段,但即使是这个也可以通过垃圾邮件机器人进行分析。我不会在前端验证这个字段。如果出现错误,服务器应该测试它,并使用预先填充的用户输入再次返回表单。

如果你想要,你可以添加一个隐藏的字段,根本不应该填充。如果您选择了这个隐藏字段的ID或标签,许多垃圾邮件机器人会填充内容,您可以使用此信息来阻止它们。