Javascript 如何在没有第二个提交按钮的情况下使上载按钮提交文件php Symfony3

我有

上传

按钮。当前，当单击时，会出现一个新按钮

save

，显示该按钮将提交包含数据的表单。单击

上传

后是否可以打开一个用于选择文件的选项卡，如果单击

打开

提交表单而不需要第二个按钮，则在选择文件后是否可以？ 假设我有这个代码

<form action="/upload" method="post">
  <input type="file" name="uploadButton" value="Upload Images"/>
</form>

---

此按钮是否可以在不使用第二个按钮的情况下提交表单并发送数据

保存

。我正在使用Symfony 3.3和twig模板。我知道javascript，如果它能帮上忙的话。提前感谢。

添加事件侦听器，以便在输入更改时自动提交表单：

HTML:

<form id="myform" action="/upload" method="post">
  <input id="myinput" type="file" name="uploadButton" value="Upload Images"/>
</form>

---

添加一个事件监听器，以便在输入更改时自动提交表单？从未想过。非常感谢。一开始似乎有效，但当我添加多个文件时，它只提交第一个文件。我必须补充一点，我在HTML中使用了简短的方式，看到了“onChange”。原因是，我需要在同一页面（在一个表中）的许多与不同galeries相关的按钮中使用这个按钮，并且每个表单都有不同的ID和“onChange”可以正常工作，直到我尝试上载多个文件。出于某种原因，这种方式在拥有所有文件之前提交表单，但第一个文件需要更详细的代码。无论如何，您可以尝试在最后一次输入时添加EventListener。这是一些有趣的行为。我真的不喜欢这个主意，但是你可以给onchange事件增加一个延迟。我在回答中添加了一些代码。布尔值只是为了确保表单不会多次提交。我不确定是否有多个文件多次触发更改事件。我刚刚测试了输入包含的内容…如果我选择3个文件，它将在控制台上注销所有3个文件。我不知道为什么它只会提交一份。您是否将表单设置为多部分？

var form = document.getElementById('myform');
var input = document.getElementById('myinput');

var change_running = false;    
input.addEventListener('change', function(){
    if(!change_running){
        setTimeout(function(){
            change_running = true;
            form.submit();
            change_running = false;     
        }, 300);
    }
});