如何在网页中添加嵌套的html表单标记

Question

根据我的场景，用户需要提交他/她的配置文件图片，然后获取图片的URL并将用户配置文件(包括用户名、性别、年龄和配置文件图片的URL )保存到服务器。

下面的代码不工作，因为我认为 nested-forms是不允许的。有人能帮我解决这个问题吗？

<form role="form" action="/submitTheProfile" method="post" >
  <input type="text"  name="fname" id="f1-first">
  <input type="text" name="age"  id="f2-first-name">
  <input type="text" name="gender" id="f3-first-name">

  <form role="form" action="/profilePicUpload" method="post" >

      <input id="file-0b" class="file" type="file">

   </form>

</form>

Answer 1

正如世界所言，您不能使用嵌套的form.so，JavaScript可以以不同的方式解决问题，例如

HTML

<form role="form" action="/submitTheProfile" method="post" >
  <input type="text"  name="fname" id="f1-first">
  <input type="text" name="age"  id="f2-first-name">
  <input type="text" name="gender" id="f3-first-name">

  <input id="file-0b" class="file" type="file">

</form>

Javascript

document.onload = function(e) {
    var el = document.getElementById('#file-0b'); el.onchange = function(){   // your code... };
 }