表单如何提交到两个页面

商业网站改版 2023年04月25日 19:41 74 im

　　表单是网站开发中非常重要的一部分，它可以让用户输入数据并将其提交到服务器上。通常情况下，表单提交后会跳转到一个新页面来处理数据。但是，有时候我们需要将表单数据同时提交到两个页面上，这样可以方便地实现多个功能。本文将介绍如何实现表单提交到两个页面。

表单如何提交到两个页面

第一步：编写HTML代码

　　首先，我们需要编写一个HTML表单，包含需要提交的数据项和提交按钮。在表单标签中添加action属性，该属性用于指定表单提交后跳转的页面地址。我们需要将action属性设置为一个JavaScript函数，该函数将表单数据同时提交到两个页面上。代码如下：

<form action="javascript:submitForm()">　　 <!-- 表单数据项 -->　　 <input type="text" name="username">　　 <input type="password" name="password">　　 <!-- 提交按钮 -->　　 <button type="submit">提交</button>　　</form>

第二步：编写JavaScript代码

　　接下来，我们需要编写一个JavaScript函数来处理表单提交。该函数将获取表单数据并将其同时提交到两个页面上。代码如下：

function submitForm() {　　 // 获取表单数据　　 var formData = new FormData(document.querySelector(form));　　 // 提交到第一个页面　　 fetch(http://www.example.com/page1.php, {　　 method: POST,　　 body: formData　　 });　　 // 提交到第二个页面　　 fetch(http://www.example.com/page2.php, {　　 method: POST,　　 body: formData　　 });　　}