PHP中的联系人表单&；jQuery

我的网站上有两张表格。第一个是带有4个字段的通用快速联系表单，通过PHP验证并发送邮件。第二个是一个四步流程表单，每个流程都隐藏起来，直到完成并通过jQuery进行验证和处理

我的问题是，当我激活我的js脚本时，第一个（快速联系）表单将不会提交，反之亦然

我知道它可能会盯着我的脸，但我似乎无法让它工作

第一张表格的代码

<div class="form-wrapper">
        <p id="req-field-desc"><span class="required">*</span> indicates a required field</p>
            <?php
            //init variables
            $cf = array();
            $sr = false;

            if(isset($_SESSION['cf_returndata'])){
                $cf = $_SESSION['cf_returndata'];
                $sr = true;
            }
            ?>
            <ul id="errors" class="<?php echo ($sr && !$cf['form_ok']) ? 'visible' : ''; ?>">
                <li id="info">There were some problems with your form submission:</li>
                <?php 
                if(isset($cf['errors']) && count($cf['errors']) > 0) :
                    foreach($cf['errors'] as $error) :
                ?>
                <li><?php echo $error ?></li>
                <?php
                    endforeach;
                endif;
                ?>
            </ul>
            <p id="success" class="<?php echo ($sr && $cf['form_ok']) ? 'visible' : ''; ?>">Your message has been submitted successfully</p>
            <form id="contact-form" method="post" action="process.php">
                <label for="name">Name: <span class="required">*</span></label>
                <input type="text" id="name" name="name" value="<?php echo ($sr && !$cf['form_ok']) ? $cf['posted_form_data']['name'] : '' ?>" placeholder="John Doe" autofocus>

                <label for="email">Email Address: <span class="required">*</span></label>
                <input type="email" id="email" name="email" value="<?php echo ($sr && !$cf['form_ok']) ? $cf['posted_form_data']['email'] : '' ?>" placeholder="johndoe@example.com">

                <label for="telephone">Telephone: <span class="required">*</span></label>
                <input type="tel" id="telephone" name="telephone" value="<?php echo ($sr && !$cf['form_ok']) ? $cf['posted_form_data']['telephone'] : '' ?>">

                <label for="message">Message: <span class="required">*</span></label>
                <textarea id="message" name="message" placeholder="Your message must be greater than 20 charcters" data-minlength="20"><?php echo ($sr && !$cf['form_ok']) ? $cf['posted_form_data']['message'] : '' ?></textarea>

                <span id="loading"></span>
                <div class="margin-auto">
                <button class="button button-primary button-small" type="submit" id="submit" value="">SUBMIT FORM</button>
                </div>

            </form>
            <?php unset($_SESSION['cf_returndata']); ?>
        </div>

*表示必填字段
尝试更改控制表单的JS

而不是

//first_step
$('form').submit(function(){ return false; });

使用

是的，这似乎已经做到了，但我必须将其添加到JS中的所有步骤中。谢谢你的帮助：-）
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
        <div id="first_step">
            <p>Step 1 of 4 - Shareholder Details</p>
            <div class="form">
                <div>
                <label for="firstname">Shareholder First Name <span>*</span></label><br>
                <input type="text" name="firstname" id="firstname" value="" autofocus>
                </div>
                <br>
                <div>
                <label for="lastname">Shareholder Last Name <span>*</span></label><br>
                <input type="text" name="lastname" id="lastname" value="">
                </div>
                <br>
                <div>
                <label for="email">Shareholder Valid Email <span>*</span><br><em>We send important administration notices to this address.</em></label><br>
                <input type="text" name="email" id="email" value="">
                </div>
                <br>
                <div>
                <label for="cemail">Confirm Email <span>*</span></label><br>
                <input type="text" name="cemail" id="cemail" value="">
                </div>
                <br>
                <div>
                <label for="phone">Shareholder Valid Contact Number <span>*</span></label><br>
                <input type="text" name="phone" id="phone" value="">
                </div>
            </div>
            <div class="clear"></div>
            <div class="margin-auto">
                <button class="button button-primary button-small" type="submit" name="submit_first" id="submit_first" value="">Next Step</button>
            </div>
        </div>
        <div class="clear"></div>

        <div id="second_step">
            <p>Step 2 of 4 - About Your Shares</p>
            <div class="form">
                <div>
                <label for="company_name">Company name in which you hold Shares <span>*</span><br><em>Exactly as on the Share Certificate</em></label><br>
                <input type="text" name="company_name" id="company_name" value="" autofocus>
                </div>
                <br>
                <div>
                <label for="ticker">Company Ticker/Symbol Number <span>*</span><br><em>Example: Google Inc. would be GOOG</em></label><br>
                <input class="uppercase" type="text" name="ticker" id="ticker" value="">
                </div>
                <br>
                <div>
                <label for="shares_held">Amount of Shares Held <span>*</span></label><br>
                <input type="text" name="shares_held" id="shares_held" value="">
                </div>
                <br>
                <div>
                <label for="shares_sell">Amount of Shares you wish to Sell <span>*</span></label><br>
                <input type="text" name="shares_sell" id="shares_sell" value="">
                </div>
            </div>
            <div class="clear"></div>
            <div class="margin-auto">
                <button class="button button-primary button-small" type="submit" name="submit_second" id="submit_second" value="">Next Step</button>
            </div>
        </div>
        <div class="clear"></div>

        <div id="third_step">
            <p>Step 3 of 4 - Terms & Conditions</p>
            <div class="form">
                <div>
                <textarea readonly>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum</textarea>
                </div>
            </div>
            <div class="clear"></div>
            <div class="margin-auto">
                <button class="button button-primary button-small" type="submit" name="submit_third" id="submit_third" value="">Next Step</button>
            </div>
        </div>
        <div class="clear"></div>

        <div id="fourth_step">
            <p>Step 4 of 4 - Review Summary</p>
            <div class="form">
                <h2>Summary of Shareholder Details to be Quoted</h2>

                <table>
                    <tr><td>Shareholder Name</td><td></td></tr>
                    <tr><td>Shareholder Email Address</td><td></td></tr>
                    <tr><td>Shareholder Contact Number</td><td></td></tr>
                    <tr><td>Company Name of Shares Held</td><td></td></tr>
                    <tr><td>Company Ticker/Symbol Number</td><td></td></tr>
                    <tr><td>Amount of Shares Held</td><td></td></tr>
                    <tr><td>Amount of Shares to Sell</td><td></td></tr>
                </table>
                <br>
            </div>
            <div class="clear"></div>
            <div class="margin-auto">
                <button class="button button-primary" type="submit" name="submit_fourth" id="submit_fourth" value="" onClick="submit()">GET A FREE QUOTE</button>
            </div>         
        </div>

    </form>

$(function(){
//original field values
var field_values = {
        //id        :  value
        'firstname'  : 'Enter your First Name',
        'lastname'  : 'Enter your Last Name',
        'email' : 'Enter your valid email',
        'cemail' : 'Confirm email',
        'phone' : 'Enter your contact number',
        'company_name'  : 'Company Name of shares',
        'ticker'  : 'Ticker Number',
        'shares_held'  : 'Amount of shares held',
        'shares_sell'  : 'Amount of shares to sell',
};

//inputfocus
$('input#firstname').inputfocus({ value: field_values['firstname'] });
$('input#lastname').inputfocus({ value: field_values['lastname'] });
$('input#email').inputfocus({ value: field_values['email'] }); 
$('input#cemail').inputfocus({ value: field_values['cemail'] }); 
$('input#phone').inputfocus({ value: field_values['phone'] }); 
$('input#company_name').inputfocus({ value: field_values['company_name'] });
$('input#ticker').inputfocus({ value: field_values['ticker'] });
$('input#shares_held').inputfocus({ value: field_values['shares_held'] });
$('input#shares_sell').inputfocus({ value: field_values['shares_sell'] });

//reset progress bar
$('#progress').css('width','0%');
$('#progress_text').html('0% Complete');

//first_step
$('form').submit(function(){ return false; });
$('#submit_first').click(function(){
    //remove classes
    $('#first_step input').removeClass('error').removeClass('valid');

    //ckeck if inputs aren't empty
    var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
    var fields = $('#first_step input[type=text]');
    var error = 0;
    fields.each(function(){
        var value = $(this).val();
        if( value.length<3 || value==field_values[$(this).attr('id')] || ( $(this).attr('id')=='email' && !emailPattern.test(value) ) ) {

            $(this).addClass('error');
            $(this).effect("shake", { times:3 }, 50);

            error++;
        } else {
            $(this).addClass('valid');
        }
    });        

    if(!error) {
        if( $('#email').val() != $('#cemail').val() ) {
                $('#first_step input[type=text]').each(function(){
                    $(this).removeClass('valid').addClass('error');
                    $(this).effect("shake", { times:3 }, 50);
                });

                return false;
        } else {   
            //update progress bar
            $('#progress_text').html('33% Complete');
            $('#progress').css('width','33%');

            //slide steps
            $('#first_step').slideUp();
            $('#second_step').slideDown();     
        }               
    } else return false;
});


$('#submit_second').click(function(){
    //remove classes
    $('#second_step input').removeClass('error').removeClass('valid');

    var fields = $('#second_step input[type=text]');
    var error = 0;
    fields.each(function(){
        var value = $(this).val();
        if( value.length<1 || value==field_values[$(this).attr('id')] ) {
            $(this).addClass('error');
            $(this).effect("shake", { times:3 }, 50);

            error++;
        } else {
            $(this).addClass('valid');
        }
    });

    if(!error) {
            //update progress bar
            $('#progress_text').html('66% Complete');
            $('#progress').css('width','66%');

            //slide steps
            $('#second_step').slideUp();
            $('#third_step').slideDown();     
    } else return false;

});


$('#submit_third').click(function(){

            //update progress bar
            $('#progress_text').html('100% Complete');
            $('#progress').css('width','100%');

    //prepare the fourth step
    var fields = new Array(
        $('#firstname').val() + ' ' + $('#lastname').val(),
        $('#email').val(),
        $('#phone').val(),
        $('#company_name').val(),
        $('#ticker').val(),
        $('#shares_held').val(),
        $('#shares_sell').val()
    );
    var tr = $('#fourth_step tr');
    tr.each(function(){
        $(this).children('td:nth-child(2)').html(fields[$(this).index()]);
    });

    //slide steps
    $('#third_step').slideUp();
    $('#fourth_step').slideDown();            
});


$('#submit_fourth').click(function(){

});
});

//first_step
$('form').submit(function(){ return false; });

$('#submit_first').click(function(e){
    e.preventDefault();
});