Javascript 是否在action.php中的表单外部设置目标按钮？

我目前有两个表单，它们将数据添加到我的数据库中。它们都可以工作，但是它们都有自己的提交按钮——我只需要一个提交按钮来收集所有表单中的数据

我找到了一些javascript，应该可以决定交易

$("#submitbutton").click(function(){
$("#form1").submit();
$("#form2").submit();
});

我所指向的按钮在两个窗体之外，如下所示：

<input id="submitbutton" type="button" value="add">

我很确定它不起作用的原因是因为我的php的编写方式。我将每个表单中的submit按钮作为目标，以超越php。 您可以看到下面的表单和php

其中一个表单允许您上传图片

<form id="form1" action="addimage.php" method="post" enctype="multipart/form-data">
            <input type="file" name="image" />
            <br/><br/>
            <input type="submit" name="sumit" value="Upload" />
        </form>

动作文件包含这个php

<?php
        if(isset($_POST['sumit']))
    {
      if(getimagesize($_FILES['image']['tmp_name'])== FALSE)
      {
        echo "Please select an image.";
      }
      else
      {
        $image= addslashes($_FILES['image']['tmp_name']);
        $name= addslashes($_FILES['image']['name']);
        $image= file_get_contents($image);
        $image= base64_encode($image);
        saveimage($name,$image);
      }
    }
        displayimage();
        function saveimage($name,$image)
        { 
      $con=mysql_connect("localhost","root","");
      mysql_select_db("ssdb",$con);
      $qry="insert into pictures (name,image) values ('$name','$image')";
      $result=mysql_query($qry,$con);
      if($result)
      {
                //echo "<br/>Image uploaded.";
            }
            else
            {
                //echo "<br/>Image not uploaded.";
            }
    }
            function displayimage()
            {
      $con=mysql_connect("localhost","root","");
      mysql_select_db("ssdb",$con);
      $qry="select * from pictures";
      $result=mysql_query($qry,$con);
      while($row = mysql_fetch_array($result))
      {
        echo '<img height="300" width="300" src="data:image;base64,'.$row[2].' "> ';
      }
      mysql_close($con); 
    }
  ?>

---

我不确定我是否完全理解您的意图，但请尝试使用HTML5添加
form=“form1”
和
form=“form2”
作为您的第二个，并让我知道这是否有效

<form id="form1" action="addimage.php" method="post" enctype="multipart/form-data">
        <input type="file" name="image" />
        <br/><br/>
        <input type="submit" name="sumit" value="Upload" />
</form>
<input type="submit" name="sumit" value="Upload" form="form1" />





我不确定是否完全理解您的意图，但请尝试使用HTML5添加
form=“form1”
和
form=“form2”
作为您的第二个，并让我知道这是否有效

<form id="form1" action="addimage.php" method="post" enctype="multipart/form-data">
        <input type="file" name="image" />
        <br/><br/>
        <input type="submit" name="sumit" value="Upload" />
</form>
<input type="submit" name="sumit" value="Upload" form="form1" />





考虑到您的补充意见，那么您建议的javascript序列将起作用，假设您有：


两种表单中被抑制的按钮，如

在表单外部添加了新按钮
..
相应地修改了PHP部分，分别引用了
$\u POST['submitbutton']
，而不是
sumit
和
Submit

您没有报告它当前不工作的情况，因此上述步骤仅针对与您将两个表单内按钮替换为唯一的表单外按钮这一事实精确相关的更改

但其他地方可能会出现问题。我特别注意到你获取和处理图像的非常规方式（至少对我而言）。您还必须确保您的javascript部分已经真正执行

如果它还不起作用，请告诉我，而不是添加错误的精确描述


根据您提供的评论和实时预览进行编辑。

完全测试实际上是不可能的，因为服务器PHP部分是遥不可及的，但我们可以使用Firebug调试JS部分

因此，添加一个断点，我们可以观察到，只要
$（“#form1”）.submit（）已执行，服务器返回带有“Place has added！”消息的新页面。

另一方面，在没有设置任何断点的情况下，服务器返回一个带有“categileinserted！”消息的新页面

虽然OP没有显示当前live预览的
addingplace.php
部分，并且与
checkbox.php
部分相比，我们可以猜测：

在简化执行部分，第一步
addingplace.php
按预期工作
我们观察到的整个执行过程仅仅意味着所有三个部分都按预期工作，但每个部分的返回消息都被下一个部分覆盖，但最后一个部分除外
换句话说，当您评论“它似乎只提交了最后一份表格”时，这是基于您只能看到的内容的错误印象。

要确保这是真实的还是不真实的您应该控制数据库中真正更新或不更新的内容。

让我知道

这就是说，必须注意的是，这说明了情侣服务器浏览器在这些情况下是如何工作的：正如@David在OP下的评论中指出的那样，提交表单会导致浏览器立即收到一个新页面，该页面会覆盖当前页面

在当前示例中，它之所以有效，是因为只有很少的表单，而且所有三个表单都是在非常短的时间内提交的，几乎是立即提交的：因此第三个
submit（）
可以在第一个返回页面到来之前执行

因此，在您的示例中，实现整个工作的推荐方法是仅使用一个表单，并使用其独特的提交按钮。顺便说一句，我想知道你为什么想要有三种形式的更复杂的结构：预期的好处是什么

最后一点，在您报告的确切问题之外：您应该注意如何编码。HTML部分中有很多不一致之处，例如：在已经存在的
中有一个
部分；异国情调的


；另外，您在第1个表单中保留了一个补充按钮。
考虑到您的补充注释，那么您建议的javascript序列将起作用，假设您有：


两种表单中被抑制的按钮，如

在表单外部添加了新按钮
..
相应地修改了PHP部分，分别引用了
$\u POST['submitbutton']
，而不是
sumit
和
Submit

您没有报告它当前不工作的情况，因此上述步骤仅针对与您将两个表单内按钮替换为唯一的表单外按钮这一事实精确相关的更改

但其他地方可能会出现问题。我特别注意到你获取和处理图像的非常规方式（至少对我而言）。您还必须确保您的javascript部分已经真正执行

如果它还不起作用，请告诉我，而不是添加错误的精确描述


根据您提供的评论和实时预览进行编辑。

完全测试实际上是不可能的，因为服务器PHP部分是遥不可及的，但我们可以使用Firebug调试JS部分

因此，添加一个断点，我们可以观察到，只要
$（“#form1”）.submit（）已执行，服务器返回带有“Place has added！”消息的新页面。

另一方面，在没有设置任何断点的情况下，服务器返回一个新页面
<form id="form1" action="addimage.php" method="post" enctype="multipart/form-data">
        <input type="file" name="image" />
        <br/><br/>
        <input type="submit" name="sumit" value="Upload" />
</form>
<input type="submit" name="sumit" value="Upload" form="form1" />