使用 ajax POST 将表单数据作为 JSON 提交

Question

所以我有一个表单，其中包含 3 个隐藏的预填充输入字段和 2 个文本输入字段。我正在尝试使用 AJAX 帖子作为 JSON 提交此表单数据。点击提交按钮后，我得到的网址为：

http：myurl.com：7001/pagename/？obj1=val1&obj2=val2&obj3=val3&obj4=val4

在此之后，我编写了一些我提到的代码，以将它们转换为JSON，然后发布它。

我遇到的问题是：

如何将我提到的代码集成到提交按钮中，以便一旦用户单击提交按钮，就会获得上述 url，并且其他所有内容(如代码中所述(都在后台发生并发出 ajax post 请求。

谢谢。如果有什么不清楚的地方，我很抱歉。

这是代码，如果我在单击提交按钮后在控制台中运行它，那么我就可以成功执行 ajax 发布。我想将此代码集成到提交按钮中。

var urlvalue = location.search.substring(1).replace(/+/g, '%20');
var postdata = JSON.parse('{"' + decodeURIComponent(urlvalue).replace(/&/g, '","').replace(/=/g,'":"') + '"}');
console.log(urlvalue);
const URL = myurl;
$.ajax({
                       url:URL,
                           type:'POST',
                          data: postdata,                    
                            success: function(result){
                                console.log(result);
                            },
                            error: function(error){
                                console.log(`Error $(error)`);
                            }
                    });

Answer 1

我不确定我是否完全理解你的问题，但如果你只是想让表单提交将数据发布到某个地方，你必须为form的onsubmit属性提供一个函数。

该函数应该包含您在问题底部拥有的几乎工作代码(以及取消带有event.preventDefault()的默认表单操作(。