Javascript jQuery执行PHP文件并添加/删除类

我正在尝试为我的网站创建一个投票脚本， 我有下面的php

<?php
echo "<form id=\"$id\" action=\"javascript:updateId()\">";
echo "<input type=\"hidden\" name=\"$id\" value=\"1\">";
echo "<button type=\"submit\" value=\"submit\" class=\"far fa-heart\"></button>";
echo "</form>";
?>

$id是sql查询的结果，因此我有50个表单具有唯一的$id

并尝试使用以下命令运行vote.php

<script>
function updateId()
{
    const form = document.getElementById('#' + id);
    const data = new FormData();
    data.append('name', form.name.value);

    fetch('./vote.php', {method: 'POST', body: data}).then(response => {
        if (!response.ok){
            throw new Error('Network response was not ok.');
        }
    }).catch(err => console.log(err));

}
</script>

函数updateId（）
{
const form=document.getElementById（“#”+id）；
const data=新表单数据（）；
data.append（'name'，form.name.value）；
fetch（'./vote.php'，{method'POST'，body:data}）。然后（response=>{
如果（！response.ok）{
抛出新错误（'网络响应不正常'）；
}
}).catch（err=>console.log（err））；
}

---

非常感谢任何帮助

最好将

id

作为

updateId（）的函数参数传递。还有几个错误：


在不使用
#
的情况下使用
getElementById

如果要访问某个表单元素，则需要通过名称值本身访问if，即它应该是
name=“name”
；您可能希望有
id
值，但如果将其作为参数传递，则不需要此隐藏字段。然而，我把它保持原样，因为我不确定您实际上需要什么值


函数updateId（id）{
const form=document.getElementById（id）；
const data=新表单数据（）；
data.append（'name'，form.name.value）；
fetch（'./vote.php'，{method'POST'，body:data}）。然后（response=>{
如果（！response.ok）{
抛出新错误（'网络响应不正常'）；
}
}).catch（err=>console.log（err））；
}
请告知您面临的错误请编辑您的问题，以包括运行代码时实际发生的情况。您还需要包括您所做的任何调试（如检查控制台的错误、检查浏览器中的“网络”选项卡以查看请求/响应、检查web服务器错误日志等），您的代码也没有真正意义。您真的想要一组表单，它们总是将硬编码的值
1
发送到
vote.php
？那为什么还要有一个表单或生成id呢？如果没有适当的解释，或者没有看到PHP代码的实际期望值，这个问题就太不清楚了。我不知道，但是如果这是OP真正想要的，我会感到惊讶。这将创建一组表单，只将相同的硬编码值
1
发布到
vote.php
-端点。我怀疑他们丢失了一些数据。如果没有，那么这个表单是完全没有意义的。@MagnusEriksson，同意，但仅仅因为没有指定它，我就这样说。您是对的，总是发送
1
或多或少是无用的，但我假设这只是一个示例，实际用例可能会有所不同。
<?php
    echo "<form id=\"$id\" action=\"javascript:updateId($id)\">";
    echo "<input type=\"hidden\" name=\"name\" value=\"1\">";
    echo "<button type=\"submit\" value=\"submit\">Submit</button>";
    echo "</form>";
?>

<script>
    function updateId(id) {
        const form = document.getElementById(id);
        const data = new FormData();
        data.append('name', form.name.value);

        fetch('./vote.php', {method: 'POST', body: data}).then(response => {
            if (!response.ok) {
                throw new Error('Network response was not ok.');
            }
        }).catch(err => console.log(err));
    }
</script>