如何为input设置两个name属性同时对接Blogger表单和Google Sheets

你之前的操作无效的核心原因：HTML的name属性不支持多值定义，用逗号、分号分隔的字符串会被识别为单个name值，无法同时被Blogger表单、Google Sheets对应的接口识别。

下面提供两种可落地的实现方案： #

方案一：保留Blogger原生表单逻辑，通过JS异步同步数据到Google Sheets #

这个方案完全保留Blogger原有表单的邮件通知功能，仅通过额外的JS代码把提交的数据同步到你绑定好Google Sheets的Google Forms接口。

• 先调整表单字段代码，保留Blogger需要的name属性，新增自定义属性存储Google Forms对应的字段ID：

  <input class='contact-form-name contact-style' id='ContactForm1_contact-form-name' name='name' data-gform-entry="entry.1583304807" placeholder='Your Name *' type='text' value=''/>
  <!-- 其他字段同理，分别添加对应entry ID的data-gform-entry属性 -->
  

• 在页面底部添加JS代码，监听表单提交事件，异步提交数据到Google Forms：

  // 替换为你自己的Google Forms提交地址
  const GFORM_SUBMIT_URL = "你的Google Forms提交链接";
  const contactForm = document.querySelector("#ContactForm1_contact-form");
  
  contactForm.addEventListener("submit", function(e) {
    // 组装Google Forms需要的表单数据
    const formData = new FormData();
    document.querySelectorAll("#ContactForm1_contact-form input, #ContactForm1_contact-form textarea").forEach(field => {
      if(field.dataset.gformEntry) {
        formData.append(field.dataset.gformEntry, field.value);
      }
    });
    // 异步提交，不影响原有Blogger表单的提交逻辑
    fetch(GFORM_SUBMIT_URL, {
      method: "POST",
      mode: "no-cors",
      body: formData
    });
  });
  

方案二：直接替换为Google Forms逻辑，原生支持邮件通知+ Sheets同步 #

这个方案更简单稳定，无需额外写自定义代码：

• 直接把整个表单的提交地址替换为你的Google Forms提交地址，所有字段的name属性改为对应的entry.xxx值
• 进入Google Forms后台的「设置」-「回复」，开启「提交时通知发送邮件」选项，用户提交表单后你会直接收到包含所有提交内容的邮件，同时表单数据会自动同步到绑定的Google Sheets中。

内容的提问来源于stack exchange，提问作者James