从表单创建并发送电子邮件+保持javascript过滤器

时间:2013-06-06 17:31:00

标签: php javascript forms email

在联系页面上,我有一个表单,允许用户向公司发送电子邮件。为了控制每个字段,我有一个表单脚本和一些CSS效果。

这很完美。 这是DEMO(遗憾的是,它无法在jsfidle上运行)

但是,我没有找到任何使用javascript发送电子邮件的解决方案(不可能)。但是我需要做些什么来保持我的javascript功能并发送这封电子邮件?

注意:发送电子邮件后,用户必须保持同一页面。

HTML

<form onSubmit="return formValidation();" id="contactForm" name="contactForm" action="index.php">
    <ul>
        <label for="name">Name <span id="required">*</span></label>
        <li><input name="name" id="name" type="text"/></li>
    </ul>
    <ul>
        <label for="telephone">Telephone <span id="required">*</span></label>
        <li><input name="telephone" id="telephone" type="text"/></li>
    </ul>
    <ul>
        <label for="email">Email <span id="required">*</span></label>
        <li><input name="email" id="email" type="text"></li>
    </ul>
    <ul>
        <label for="message">Message <span id="required">*</span></label>
        <li><textarea name="message" id="message" cols="70" rows="10" ></textarea></li>
    </ul>
    <ul id="row_submit_button">
        <li><input type="submit" value="Submit" id="submit_button"/></li>
    </ul>   
    <ul id="form_incorect_message">
        <li>Please, fill in the form correctly.</li>
    </ul>   
</form> 

的Javascript

function formValidation()  
{  
    var name = document.contactForm.name; // required
    var telephone = document.contactForm.telephone; // required
    var email = document.contactForm.email; // required
    var message = document.contactForm.message; // required

    fname_validation(name);
    number_validation(telephone);
    email_validation(email);
    message_validation(message);

    if (fname_validation(name)&&number_validation(telephone)&&email_validation(email)&&message_validation(message))
    {
        document.getElementById('form_incorect_message').style.visibility = 'hidden';
        document.getElementById('contactForm').style.visibility = 'hidden';
        document.getElementById('send_ok').style.display = 'block';
//      sendMail();
    }
    else
    {

    }   
    return false;  
};

function fname_validation(name)  
{   

    if((name.value!="")&&(name.value!=" "))
    {
        var letters = /^[A-Za-z _-]+$/; 
        if(name.value.match(letters))  
        {  
            document.getElementById('name').style.borderColor = "#56D45C";
            return true;
        }  
        else  
        {  
            document.getElementById('form_incorect_message').style.visibility = "visible";
            document.getElementById('name').style.borderColor = "red"; 
            return false;
        } 
    } 
    else
    {
        document.getElementById('form_incorect_message').style.visibility = "visible";
        document.getElementById('name').style.borderColor = "red"; 
        return false;
    }
};


function message_validation(message)  
{   
    if(message!=""&&message!=" ")
    {
        var letters = /^[A-Za-z0-9 _-]+$/; 
        if(message.value.match(letters))  
        {  
            document.getElementById('message').style.borderColor = "#56D45C";
            return true;
        }  
        else  
        {  
            document.getElementById('form_incorect_message').style.visibility = "visible";
            document.getElementById('message').style.borderColor = "red";
            return false;
        } 
    } 
    else
    {
        document.getElementById('form_incorect_message').style.visibility = "visible";
        document.getElementById('message').style.borderColor = "red";   
        return false;   
    }
};

function number_validation(telephone)  
{   
    var numbers = /^[0-9+]+$/;  
    if(telephone.value.match(numbers))  
    { 
        document.getElementById('telephone').style.borderColor = "#56D45C"; 
        return true; 
    }  
    else  
    {  
        document.getElementById('form_incorect_message').style.visibility = "visible";
        document.getElementById('telephone').style.borderColor = "red";
        return false;   
    }
};

function email_validation(email)  
{  
    var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;  
    if(email.value.match(mailformat))  
    {  
        document.getElementById('email').style.borderColor = "#56D45C";  
        return true; 
    }  
    else  
    {  
        document.getElementById('form_incorect_message').style.visibility = "visible";
        document.getElementById('email').style.borderColor = "red";   
        return false;       
    } 
};

function sendMail() 
{


//     var link = "mailto:my-email@gmail.com"
//              + "?cc=xxxxxxx@xXXXXX.co.uk"
//              + "&subject=" + escape("This is my subject")
//              + "&body=" + escape(document.getElementById('myText').value);
//     window.location.href = link;
};

由于

0 个答案:

没有答案