jQuery:在同一页面上提交两个相同表单的函数

时间:2018-02-15 17:27:03

标签: javascript jquery forms form-submit

我有一个页面,在不同的部分包含两次相同的表单 - 一个简单的单输入字段来输入电子邮件地址。我配置了以下submit函数,我想知道允许两个表单彼此独立运行的最简单路由;因为我已经配置了它,所以这两种形式都被脚本有效地视为一个单独的实体。有没有办法指定在.form div中提交最近的活动表单?或者我应该以完全不同的方式配置提交功能?感谢您的任何见解。

$(document).ready(function() {
var infoForm = $('.form form');
var formSuccessMsg = $('p.success');
var formErrorMsg = $('p.error');

infoForm.submit(function() {
    // var url = $(this).attr('action');
    var url = $(this).attr('action') + '?showtemplate=false';
    var emailInput = $('.form input[type=text]').val();
    var data = $(this).serialize();

    if( emailInput.length === 0 || emailInput == '' || !isValidEmailAddress(emailInput) ) {
        formErrorMsg.show();
        return false;
    } else {
        $.post(url, data, function(data, textStatus, jqXHR) {
            // alert('post came back');
            infoForm.hide();
            formErrorMsg.hide();
            formSuccessMsg.show();
            console.log(emailInput);
        });
        return false;
    }
});
});

更新:这是标记(表单代码由CMS生成):

<div class="form">
   <div class="form-response">
      <p class="success">Thank you!</p>
      <p class="error">Please enter a valid email address</p>
   </div>
   <form id="mc2e7cmoduleform_1" method="post" action="post" enctype="multipart/form-data">
      <div class="info-packet-form">
         <div class="required"><input type="text" name="mc2e7cfbrp__35" value="" size="25" maxlength="80"   id="fbrp__35" /></div>
         <div class="submit"><input name="mc2e7cfbrp_submit" id="mc2e7cfbrp_submit" value="Submit" type="submit" class="fbsubmit"   /></div>
      </div>
   </form>
</div>

1 个答案:

答案 0 :(得分:1)

The Beatles
All You Need Is Love
www.songurl.com
相关问题