您是否希望在访问者提交表单时阻止您的页面刷新？默认情况下，整个页面在点击表单提交按钮后重新加载。这就是在表单中输入的数据在服务器中传输和存储的方式。
在本文中，我们将向您展示如何在 WordPress 表单上启用 Ajax 提交并防止页面重新加载。
为什么在 WordPress 中启用 Ajax 表单提交
如果您想在模式弹出窗口中嵌入表单，Ajax 表单提交特别有用。如果未启用 AJAX 表单提交，则整个页面将需要刷新，从而导致弹出窗口关闭。这样，用户可能会错过让他们保持参与的重要确认消息。
启用 AJAX 表单提交后，您的用户可以在同一页面上提交表单时看到确认消息，而无需重新加载。
要上WordPress website 要启用 ajax 表单提交，我们建议您使用 WPForms，这是 WordPress 的最佳表单插件。
第 1 步：创建新表单
要开始创建表单，首先您必须在您的 WordPress 网站上安装 WPForms 插件。
不确定如何？没问题。您可以跳到我们的指南，了解如何安装 WordPress 插件以进行排序。
安装并激活插件后，转到您的 WordPress 仪表板并导航至 WPForms » 添加新的。您现在将被重定向到一个页面，您可以在其中为表单选择模板。
WPForms 提供了 7 种不同的表单模板供您选择。让我们为本教程选择 Simple Contact Form 选项，并向表单添加文件上传字段。
您现在将在屏幕 请参阅 Form Builder。在屏幕的左侧，您有“添加字段”和“字段选项”选项卡。您可以使用这些选项卡配置联系表单。
WPForms让您轻松通过拖放轻松将字段添加到表单。您还可以通过拖放来更改字段的位置。如果你想删除一个字段，那也很容易。只需将鼠标悬停在不需要的字段上，然后单击将出现在该字段右上角的删除图标。
在“字段选项”选项卡下，您可以更改字段的标签、更改名称字段的格式、更改字体大小以及启用或禁用标签和子标签。您还可以选择启用条件逻辑选项。
使用表单生成器创建表单后，单击“保存”按钮以保留更改。
现在我们已经创建了一个简单的联系表单，让我们向它添加文件上传功能。
要添加文件上传功能，您只需点击左侧面板中的“文件上传”字段即可。或者，您可以将文件上传表单字段拖放到表单构建器中的首选位置。
第三步：启用Ajax表单提交
保存更改后，单击页面构建器左侧的“设置”选项卡。你会在这里看到几个选项。转到“常规”选项。在此下方，您将看到许多字段。您可以在此处更改表单名称、添加表单说明、更改按钮文本等。
如果向下滚动，您会看到一些复选框。您可以选中“启用 Ajax 表单提交”复选框。单击屏幕右上角的“保存”按钮以完成该过程。
现在转到“通用选项卡下的通知选项卡。此选项会在每次有人提交表单时通知您。因此，请在第一个字段中输入管理员的电子邮件地址或负责接收电子邮件的人员。您还可以输入电子邮件主题、发件人姓名、收件人地址，以及您自己的消息。
完成后，请确保保存更改。您还可以设置访问者在单击提交按钮后收到的确认消息。
第四步：使用Ajax提交发布表单
最后一步是在您的网站上发布您的 Ajax 提交表单。为此，转到您希望表单出现的页面。
您可以从 Pages » Add New on你的 WordPress 仪表板。现在给你的页面添加一个标题。在页面的文本编辑器上，单击e 添加表格选项。屏幕上会弹出一个新窗口。
点击下拉箭头并选择您刚刚创建的表单。现在单击“添加表单”按钮。您会看到嵌入代码反映在页面的文本编辑器中。您可以通过单击屏幕右侧的“预览”按钮来检查表单的外观。
然后您可以单击“发布”按钮最终使表单生效。
这很容易，不是吗？
您现在可能想要跟踪您的联系表收到的按钮点击次数。为此，请查看我们的跟踪链接和按钮点击指南。
文章How to Submit Forms Without Page Refresh in WordPress 最先出现在 IsItWP – WordPress Technical Lookup Tool。
