JQuery / PHP表单没有提交

Question

I have a site I'm working on Modestewebstudio.com

On the contact section of the site I have a form that I'm trying to submit using jQuery and pHp. For some reason the form does not submit. The validation works fine but whenever I hit submit nothing happens.

$(document).ready(function () {

$(window).load(function() { $("#load").fadeOut("slow"); });
    
var fadeInElement = function(id) {
    $('#' + id).fadeIn();
};
    
//HOME-------------------------------------------------

$(".home").click(function () {
    $('#about, #works, #contact').filter(":visible").fadeOut();
    fadeInElement('home');
});
    
//ABOUT------------------------------------------------
    
$(".about").click(function () {
    $('#home, #works, #contact').filter(":visible").fadeOut();
    fadeInElement('about');
});
    
//WORKS------------------------------------------------

$(".works").click(function () {
    $('#home, #about, #contact').filter(":visible").fadeOut();
    fadeInElement('works');
});
    
//CONTACT----------------------------------------------
   
$(".contact").click(function () {
    $('#home, #about, #works').filter(":visible").fadeOut();
    fadeInElement('contact');
});
    
<!--//--><![CDATA[//><!--  
$('form#contact-us').submit(function() { 
    $('form#contact-us .error').remove();  
    var hasError = false;  
    $('.requiredField').each(function() {  
        if($.trim($(this).val()) == '') {  
            var labelText = $(this).prev('label').text();  
            $(this).parent().append('<span class="error">Your '+labelText+' is missing.</span>');  
            $(this).addClass('inputError');  
            hasError = true;  
        } else if($(this).hasClass('email')) {  
            var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;  
            if(!emailReg.test($.trim($(this).val()))) {  
                var labelText = $(this).prev('label').text();  
                $(this).parent().append('<span class="error">Your '+labelText+' is invalid.</span>');  
                $(this).addClass('inputError');  
                hasError = true;  
            }  
        }  
    });
    if(!hasError) {
        var formInput = $(this).serialize();
        $.post($(this).attr('action'),formInput, function(data){
            $('form#contact-us').slideUp("fast", function() {                  
                $(this).before('<p>Your email has been delivered!</p>');
            });
        });
    }
        
    return false;   
});
//-->!]]>
//-----------------------------------------------------    
});

<?php 
error_reporting(E_ALL ^ E_NOTICE); // hide all basic notices from PHP

//If the form is submitted
if(isset($_POST['submitted'])) {
    
    // require a name from user
    if(trim($_POST['contactName']) === '') {
        $nameError =  'Forgot your name!'; 
        $hasError = true;
    } else {
        $name = trim($_POST['contactName']);
    }
    
    // need valid email
    if(trim($_POST['email']) === '')  {
        $emailError = 'Forgot to enter in your e-mail address.';
        $hasError = true;
    } else if (!preg_match("/^[[:alnum:]][a-z0-9_.-]*@[a-z0-9.-]+\.[a-z]{2,4}$/i", trim($_POST['email']))) {
        $emailError = 'You entered an invalid email address.';
        $hasError = true;
    } else {
        $email = trim($_POST['email']);
    }
        
    // we need at least some content
    if(trim($_POST['comments']) === '') {
        $commentError = 'You forgot to enter a message!';
        $hasError = true;
    } else {
        if(function_exists('stripslashes')) {
            $comments = stripslashes(trim($_POST['comments']));
        } else {
            $comments = trim($_POST['comments']);
        }
    }
        
    // upon no failure errors let's email now!
    if(!isset($hasError)) {
        
        $emailTo = '[e-mail]';
        $subject = 'Submitted message from '.$name;
        $sendCopy = trim($_POST['sendCopy']);
        $body = "Name: $name 

Email: $email 

Comments: $comments";
        $headers = 'From: ' .' <'.$emailTo.'>' . "
" . 'Reply-To: ' . $email;

        mail($emailTo, $subject, $body, $headers);
        
        // set our boolean completion value to TRUE
        $emailSent = true;
    }
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Denneson Modeste</title>

<!--Fonts-->
<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Syncopate' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Special+Elite' rel='stylesheet' type='text/css'>
    
<!--CSS-->
<link rel="stylesheet" type="text/css" href="style.css"/>

</head>

<body>
    <div id="load">
        <div class="load-logo pulse"></div>
        <p>Loading</p>
    </div>
    
    <div class="tv"></div>
    
    <div class="home tv-btn">HOME</div>
    <div class="about tv-btn">ABOUT</div>
    <div class="works tv-btn">WORKS</div>
    <a href="http://nobizlikemy.biz"><div class="blog tv-btn">BLOG</div></a>
    <div class="contact tv-btn">CONTACT</div>
    
    <div id="home" class="channel">
        <iframe width="100%" height="100%" src="https://www.youtube.com/embed/JdRO97mFMx8?rel=0&controls=0&autoplay=1&showinfo=0&disablekb=1&disablekb=1&modestbranding=1&start=7&loop=1&playlist=JdRO97mFMx8&wmode=opaque" frameborder="0" allowfullscreen></iframe>
    </div><!-- end of home -->

    <div id="about" class="channel">
        <iframe width="100%" height="100%" src="https://www.youtube.com/embed/JdRO97mFMx8?rel=0&controls=0&autoplay=1&showinfo=0&disablekb=1&disablekb=1&modestbranding=1&start=7&loop=1&playlist=JdRO97mFMx8&wmode=opaque" frameborder="0" allowfullscreen></iframe>
    </div><!-- end of about -->
    
    <div id="works" class="channel">

    </div><!-- end of works -->
    
    <div id="contact" class="channel">
        <div class="contact-border"></div>
        <div class="stamp"></div>
        
        <div class="contact-section">
            <h3>Have a question or wanna say hello? Leave a message below.</h3>
            
            <?php if(isset($emailSent) && $emailSent == true) { ?>  
                <p class="info">Your message was sent and will be responded to ASAP.</p>  
            <?php } else { ?>
            
            <form id="contact-us" action="contact.php" method="post"> 
                
                    <?php if(isset($hasError) || isset($captchaError) ) { ?>  
                        <p class="alert">There was a mistake in the message</p>  
                    <?php } ?>
                    
                    <label>Name</label>
                    <input type="text" name="contactName" id="contactName" value="<?php if(isset($_POST['contactName'])) echo $_POST['contactName'];?>" class="txt requiredField" placeholder="Name:" />  
          
                    <?php if($nameError != '') { ?>  
                        <br /><span class="error"><?php echo $nameError;?></span>   
                    <?php } ?>    
         
                    <label>E-mail</label>
                    <input type="text" name="email" id="email" value="<?php if(isset($_POST['email']))  echo $_POST['email'];?>" class="txt requiredField email" placeholder="Email:" />  
          
                    <?php if($emailError != '') { ?>  
                        <br /><span class="error"><?php echo $emailError;?></span>  
                    <?php } ?>   
             
                    <label>Message</label>
                    <textarea name="comments" id="commentsText" class="txtarea requiredField" placeholder="Message:"><?php if(isset($_POST['comments'])) { if(function_exists('stripslashes')) { echo stripslashes($_POST['comments']); } else { echo $_POST['comments']; } } ?></textarea>  
              
                    <?php if($commentError != '') { ?>  
                        <br /><span class="error"><?php echo $commentError;?></span>   
                    <?php } ?>  
                          
                    <button name="submit" type="submit" class="subbutton"> </button>  
                    <input type="hidden" name="submitted" id="submitted" value="true" />  
            </form>             
        </div><!-- end of contact-section -->
                  
<?php } ?>  
</div>  
        </div>
    </div><!-- end of contact -->
    
<!--Javascript-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="js/application.js"></script>
    
</body>
</html>

</div>

Answer 1

Submitting the form results in the following error

404 (Not Found) http://modestewebstudio.com/contact.php

Make sure there that the file is in fact named contact.php, and that it's placed in the root directory of your web server.