使用JavaScript提交Laravel表单

我有一个HTML表单，目前我使用表单操作属性和php脚本提交该表单。post请求成功，但它会重新加载页面，我希望避免这种情况。该项目使用Laravel/Blade PHP模板

@csrf
...
提交

为了防止页面重新加载，我想使用JavaScript发送post请求，并使用

preventDefault（）

。我试图使用fetch，但由于我不熟悉Laravel，我不知道应该发送哪个参数。例如，身体是什么

有很多关于这个主题的帖子，但是大多数都是过时的，导致了jQuery解决方案，这对我来说不是一个选择

以下是我尝试过的：

document.querySelector（“#更新表单”）.addEventListener（'submit'，（e）=>{
e、 预防默认值（）；
fetch（{route（'update'，['id'=>$user['id']]）}}，{
方法：“发布”
})。然后（（）=>console.log（'success'）；
});

您可以使用

FormData

对象获取表单字段和值，然后在

body

字段中使用

fetch

发送表单字段和值

FormData

将

元素作为第一个参数，并解析其字段和值

document.querySelector（“#更新表单”）.addEventListener（'submit'，（e）=>{
e、 预防默认值（）；
var formData=新formData（即目标）；
fetch（{route（'update'，['id'=>$user['id']]）}}，{
方法：“POST”，
正文：formData
})。然后（（）=>console.log（'success'）；
});

您可以使用

FormData

对象获取表单字段和值，然后在

body

字段中使用

fetch

发送表单字段和值

FormData

将

元素作为第一个参数，并解析其字段和值

document.querySelector（“#更新表单”）.addEventListener（'submit'，（e）=>{
e、 预防默认值（）；
var formData=新formData（即目标）；
fetch（{route（'update'，['id'=>$user['id']]）}}，{
方法：“POST”，
正文：formData
})。然后（（）=>console.log（'success'）；
});