該聯繫表格不工作爲什麼聯繫表單不能在我的網站上工作?
這是在頁面中使用的代碼。
jQuery的index.html中
<!--contact form -->
<script type="text/javascript">
$(document).ready(function(){
$('#send_message').click(function(e){
//stop the form from being submitted
e.preventDefault();
/* declare the variables, var error is the variable that we use on the end
to determine if there was an error or not */
var error = false;
var name = $('#name').val();
var email = $('#email').val();
var message = $('#message').val();
/* in the next section we do the checking by using VARIABLE.length
where VARIABLE is the variable we are checking (like name, email),
length is a javascript function to get the number of characters.
And as you can see if the num of characters is 0 we set the error
variable to true and show the name_error div with the fadeIn effect.
if it's not 0 then we fadeOut the div(that's if the div is shown and
the error is fixed it fadesOut.
The only difference from these checks is the email checking, we have
email.indexOf('@') which checks if there is @ in the email input field.
This javascript function will return -1 if no occurence have been found.*/
if(name.length == 0){
var error = true;
$('#name_error').fadeIn(500);
}else{
$('#name_error').fadeOut(500);
}
if(email.length == 0 || email.indexOf('@') == '-1'){
var error = true;
$('#email_error').fadeIn(500);
}else{
$('#email_error').fadeOut(500);
}
if(message.length == 0){
var error = true;
$('#message_error').fadeIn(500);
}else{
$('#message_error').fadeOut(500);
}
//now when the validation is done we check if the error variable is false (no errors)
if(error == false){
//disable the submit button to avoid spamming
//and change the button text to Sending...
$('#send_message').attr({'disabled' : 'true', 'value' : 'Sending...' });
/* using the jquery's post(ajax) function and a lifesaver
function serialize() which gets all the data from the form
we submit it to send_email.php */
$.post("send_email.php", $("#contact_form").serialize(),function(result){
//and after the ajax request ends we check the text returned
if(result == 'sent'){
//if the mail is sent remove the submit paragraph
$('#cf_submit_p').remove();
//and show the mail success div with fadeIn
$('#mail_success').fadeIn(500);
}else{
//show the mail failed div
$('#mail_fail').fadeIn(500);
//reenable the submit button by removing attribute disabled and change the text back to Send The Message
$('#send_message').removeAttr('disabled').attr('value', 'Send The Message');
}
});
}
});
});
</script>
下面是HTML代碼的容器
聯繫表格的HTML @的index.html
<!--contact form -->
<div id="contact-form">
<div id="contact_form_holder">
<form action="index.php" method="post" id="contact_form">
<p>
Your Name:
<input name="name" class="field" id="name" type="text">
</p><div id="name_error" class="error"><img src="web_files/error.png"> Please enter your name</div>
<p></p>
<p>
Your Email:
</p><div><input name="email" class="field" id="email" type="text">
<div id="email_error" class="error"><img src="web_files/error.png"> OOps!! i can't get back to you in this mail id</div>
</div>
<p></p>
<p>
The Message:
</p><div>
<textarea name="message" class="field" id="message"></textarea>
<div id="message_error" class="error"><img src="web_files/error.png"> Forgot why you came here?</div></div>
<p></p>
<div id="mail_success" class="success"><img src="web_files/success.png"> Thank you. The mailman is on his way.</div>
<div id="mail_fail" class="error"><img src="web_files/error.png"> Sorry, don't know what happened. Try later.</div>
<p id="cf_submit_p">
<!--<input type='submit' id='send_message' value='Send it to me' class="submit"> -->
<input id="send_message" value="Send The Message" class="submit" type="submit">
</p>
</form>
</div>
</div>
<!--contact form -->
,最後這裏是PHP代碼爲
send_email.php
//we need to get our variables first
$email_to = '[email protected]'<script type="text/javascript">
/* <![CDATA[ */
(function(){try{var s,a,i,j,r,c,l=document.getElementById("__cf_email__"); a=l.className;if(a){s='';r=parseInt(a.substr(0,2),16);for(j=2;a.length-j;j+=2) {c=parseInt(a.substr(j,2),16)^r;s+=String.fromCharCode(c);}s=document.createTextNode(s); l.parentNode.replaceChild(s,l);}}catch(e){}})();
/* ]]> */
</script>';
//the address to which the email will be sent
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
/*the $header variable is for the additional headers in the mail function,
we are asigning 2 values, first one is FROM and the second one is REPLY-TO.
That way when we want to reply the email gmail(or yahoo or hotmail...) will know
who are we replying to. */
$headers = "From: $email\r\n";
$headers .= "Reply-To: $email\r\n";
if(mail($email_to, $subject, $message, $headers)){
echo 'sent'; // we are sending this text to the ajax request telling it that the mail is sent..
}else{
echo 'failed';// ... or this one to tell it that it wasn't sent
}
在世界上這是什麼關呢? JS在PHP中做什麼? – Stewie 2012-03-15 12:32:52
不!我試圖推倒js它似乎沒有工作 – Beginner 2012-03-16 05:15:14