在jQuery中提交多个表单不起作用

Question

我正在尝试使用 jQuery 修改一些 php/html 代码，以便一键提交多个表单。

 $html .= "<div class='casephone'>
                                    <h1>".$row['name']."</h1>
                                    <img src='phones/phones/".$phonename."/".$row['imgname_full']."' />
                                    <img src='phones/phones/".$phonename."/".$row['imgname_half']."' /><br />
                                    Wymiary:<br />
                                    Wysokość: <span>".$row['height']."px</span><br />
                                    Szerokość: <span>".$row['width']."px</span>
                                    Rodzaj Canvas: <span>".$row['canvas_name']."</span><br><br><br>
                                    Zmień folder ze zdjęciami etui
                                    <form action='script/editdesccase' method='POST'>
                                                    ".$this->descPhone()."
                                                    <input type='text' name='iddap' value='".$row['id_dap']."' hidden />
                                                    <input type='submit' value='Zmień' class='submit-form'/>
                                                </form>
                                    <form action='script/changeheightofcase' method='post' class='wysokosc' target='iframe1'> 
                                        <input type='text' name='height' placeholder='Zmień wysokość telefonu' class='input'/>
                                        <input type='text' name='iddap' value='".$row['id_dap']."' hidden />
                                        <input type='text' name='idcase' value='".$row['id_canvas']."' hidden />
                                        <input type='submit' value='Zmień' class='submit-form'/>
                                    </form>
                                    <form action='script/changewidthofcase' method='post' class='szerokosc' target='iframe2'>
                                        <input type='text' name='width' placeholder='Zmień szerokość telefonu' class='input'/>
                                        <input type='text' name='iddap' value='".$row['id_dap']."' hidden />
                                        <input type='text' name='idcase' value='".$row['id_canvas']."' hidden />
                                        <input type='submit' value='Zmień' class='submit-form'/>
                                    </form>
                                    Zmień rozmiar Canvas
                                    <h3>Jeżeli wysokość telefony jest większa od 460px to zmień rozmiar Canvas na Wys.: 540px na Szer.: 690px i podmień szablony na większe</h3>
                                    <form action='script/changecanvasproperities' method='POST'>
                                        ".$this->viewSelectCanvasProperities()."
                                        <input type='text' name='iddap' value='".$row['id_dap']."' hidden />
                                        <input type='submit' value='Zmień' class='submit-form' />
                                    </form>
                                    <form action='script/changeimgofcase' method='post' name='zdjecie1' enctype='multipart/form-data' target='iframe3'>
                                        Zmień Szablon telefonu do canvas: <input type='file' name='caseimg'/>
                                        <input type='text' name='iddap' value='".$row['id_dap']."' hidden />
                                        <input type='text' name='phonename' value='".$_GET['phonename']."' hidden />
                                        <input type='submit' value='Zmień' class='submit-form'/>
                                    </form>
                                    <form action='script/changeimgofcase1' method='post' name='zdjecie2' enctype='multipart/form-data' target='iframe4'>
                                        Zmień Szablon2 telefonu do canvas: <input type='file' name='caseimg1'/>
                                        <input type='text' name='iddap' value='".$row['id_dap']."' hidden />
                                        <input type='text' name='phonename' value='".$_GET['phonename']."' hidden />
                                        <input type='submit' value='Zmień' class='submit-form'/>
                                    </form>

                                    <form action='script/changebackgroundofcase' method='post' enctype='multipart/form-data' target='iframe5'>
                                        Zmień Tło telefonu do canvas: <input type='file' name='casebackground'/>
                                        <input type='text' name='iddap' value='".$row['id_dap']."' hidden />
                                        <input type='text' name='phonename' value='".$_GET['phonename']."' hidden />
                                        <input type='submit' value='Zmień' class='submit-form'/>
                                    </form>
                                    <h1>Nasze Propozycje - Opcje</h1>
                                    <h3>Wybierz folder z którego będą pobierane nasze propozycje</h3>
                                    ".$this->caseImgPropozition($row['id_dap'], $_GET['phonename'])."
                                    <form  action='script/availablecaseofphone' method='post'>
                                        ".$avaiable."
                                        <input type='text' name='iddap' value='".$row['id_dap']."' hidden />
                                        <input type='submit' value='Zmień' class='submit-form'/>
                                    </form>
                                    <a href='script/removecaseofphone?id=".$row['id_dap']."&name=".$_GET['phonename']."' class='remove-link'>Usuń rodzaj etui</a>
                             </div>
                             <input type='submit' class='koko' value='zaktualizuj'>
      <script>
    $(document).ready(function(){
        $('.koko').click(function(){
           $('form').each(function(){
           $(this).submit();


           });

        });
    });</script>
";

所以看起来 jQuery 在这里工作，因为如果我输入警报而不是提交，我可以看到弹出几次。 如果我输入 console.log 我会得到console.log($(this));

    [form#date-form, context: form#date-form]
phone?phonename=vodafonesmartprime6:229 [form#option, context: form#option]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form#availablephone, context: form#availablephone]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form.wysokosc, context: form.wysokosc]
phone?phonename=vodafonesmartprime6:229 [form.szerokosc, context: form.szerokosc]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]
phone?phonename=vodafonesmartprime6:229 [form, context: form]

但没有数据更改操作会将我重定向到主页。现在我需要做一些更新，它将涉及至少 4 个要更改和更新的表单数据。所以我想点击一个按钮而不是 4 让它更快。

Answer 1

每个表单都有一个动作，例如：script/changebackgroundofcase。我不确定每个操作目标应该有什么样的扩展名：.php、.html，还是没有扩展名？所以，请填写相应的actions。

但是，否则，您将.koko 设置为提交按钮。这是不允许的，因为它暗示了外在形式的“存在”。但是文档中不能有嵌套表格，这是不允许的！所以，我只是替换了这个：

<input type='submit' class='koko' value='zaktualizuj'>

用这个：

<input type='button' class='koko' value='zaktualizuj'>

否则一切看起来都很好。

如果提交后仍然没有正确读取数据，则必须为控件定义id 属性。请务必为整个网页仅提供唯一的 id 属性。