You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

求助:如何用jQuery实现表单两次提交并映射字段值

表单两次提交的jQuery实现求助

我需要处理一个第三方落地页生成的表单,无法对表单结构做过多修改。需求是触发表单提交时,完成两次提交操作:

  • 第一次提交表单的全部原始字段值
  • 第二次提交时将部分字段值进行重映射(用推荐人信息替换提交人信息,清空原推荐人字段)

我已经编写了以下jQuery代码,尝试通过AJAX实现无刷新的两次提交,但希望能得到优化建议或问题排查帮助:

jQuery(document).ready(function() {

  jQuery("form").submit(function(e) { // 监听原始表单提交事件
  
      e.preventDefault(); // 阻止表单默认提交/页面刷新
      
      // 收集原始表单数据用于第一次AJAX提交
      var formData = {
        your_first_name: jQuery("#your_first_name").val(),
        your_last_name: jQuery("#your_last_name").val(),
        your_company_name: jQuery("#your_company_name").val(),
        your_work_email: jQuery("#your_work_email").val(),
        your_referrals_first_name: jQuery("#your_referrals_first_name").val(),
        your_referrals_last_name: jQuery("#your_referrals_last_name").val(),
        your_referrals_company_name: jQuery("#your_referrals_company_name").val(),
        your_referrals_email_address: jQuery("#your_referrals_email_address").val(),
        your_referrals_phone_Number: jQuery("#your_referrals_phone_number").val(),
        how_did_you_hear_about_electrics_referral_program: jQuery("#how_did_you_hear_about_electrics_referral_program").val(),
      }

      // 重映射字段值用于第二次AJAX提交
      var repostData = {
        your_first_name: jQuery("#your_referrals_first_name").val(),
        your_last_name: jQuery("#your_referrals_last_name").val(),
        your_company_name: jQuery("#your_referrals_company_name").val(),
        your_work_email: jQuery("#your_referrals_email_address").val(),
        your_referrals_first_name: '',
        your_referrals_last_name: '',
        your_referrals_company_name: '',
        your_referrals_email_address: '',
        your_referrals_phone_Number: '',
        how_did_you_hear_about_electrics_referral_program: jQuery("#how_did_you_hear_about_electrics_referral_program").val(),
      }
      
      // 第一次提交原始数据
      jQuery.ajax ({
        type: 'POST',
        data: formData,
        dataType: 'json',
        success: function (data) {
          console.log("Form 1 submitted successfully!");

          // 第一次提交成功后,执行第二次提交
          jQuery.ajax ({
            type: 'POST',
            data: repostData,
            dataType: 'json',
            success: function (data) {
              console.log("Form 2 submitted successfully!");
            },
            error: function (data) {
              console.log("An error has occured on form 2");
            }
          });
        },
        error: function (data) {
          console.log("An error has occured on form 1");
        }
      });

  });
});

我目前的思路是通过AJAX实现无刷新提交,确保第二次提交仅在第一次成功后执行,但不确定是否存在逻辑漏洞或可优化的点,希望能得到帮助。

内容的提问来源于stack exchange,提问作者David Martini

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.09 23:40:58