Javascript 在提交表单之前在表单中播放音频文件

我有一张表格：

<form ....>

<input type="file" name="file-main" id="file-main" class="inputfile inputfile-3"  multiple/>
<audio preload="none" src="">
// skipping submission buttons for brevity

</form>

//为了简洁起见，跳过提交按钮

---

当用户从浏览器中选择音频文件时，我希望使所选音频可以在表单中播放，以便用户知道他选择了什么（在表单发送到服务器之前）。我不熟悉JS、HTML5、Ajax和Jquery，所以我正在努力解决这些问题。如何以最短的方式完成此操作？

您可以使用html 5音频播放器

<form>
    <audio controls>
          <source src="audiofilename" type="audiofiltype">
        Your browser does not support the audio element.
    </audio>
      <input type="checkbox" value="filename/fileid" />
    <audio controls>
          <source src="audiofilename" type="audiofiltype">
        Your browser does not support the audio element.
    </audio>
    <input type="checkbox" value="filename/fileid" />
    <input type="submit" value="Submit">
</form>
<!--//inside here you can put your from with check box then user can play and if he wants to download he can check it then finally you can submit your form.-->

您的浏览器不支持音频元素。
您的浏览器不支持音频元素。

---

然后，你可以在下面放一个按钮下载，或者你想要的任何形式。

可能重复感谢，但我不使用php，也不懂php。我在寻找ajax/jquery/JS解决方案，但你们是如何处理来自服务器端的用户输入的呢？我使用的是Python flask。服务器端对我来说是小菜一碟，但是前端的脚本编写很难，我更新了答案。就像这样，你只需要把你所有的音频文件，一旦用户检查了他想要的内容并提交，你就可以用你使用的任何语言来处理他的输入。