html - 并排放置两个不同形式的按钮

Question

我有两种形式。一种用于登录，另一种用于重置密码。现在我想并排设置两个按钮(登录、密码重置)。

但我不知道，该怎么做。

这是我的代码:

<form action="login" method="POST">
	<div class="row">
		<div class="col-md-2">Username:</div>
		<div class="col-md-4 input-group input-group-sm">
			<span class="input-group-addon" id="important">
              <span class="glyphicon glyphicon-play" />
              <input class="form-control" type="text" name="username" id="username" aria-describedby="important" />
            </span>
		</div>
	</div>
	<div class="row">
		<div class="col-md-2">Passwort:</div>
		<div class="col-md-4 input-group input-group-sm">
          <span class="input-group-addon" id="important">
			<span class="glyphicon glyphicon-play" />
            <input class="form-control" type="password" name="password" id="password" aria-describedby="important" />
          </span>
		</div>
	</div>
	<div class="row">
		<div class="col-md-2 input-group-sm">
			<input type="submit" class="form-control btn-default" value="Login" />
		</div>
	</div>
</form>
<form action="reset" method="POST">
	<div class="row">
		<div class="col-md-2 input-group-sm">
			<input class="form-control btn-default" type="submit" value="Passwort vergessen" />
		</div>
	</div>
</form>

我希望你能帮助我。

Answer 1

将按钮元素保持在相同的表单中，并将 form 属性添加到要与其他表单元素关联的其他按钮。

来自 MDN :

The form element that the button is associated with (its form owner). The value of the attribute must be the id attribute of a element in the same document. If this attribute is not specified, the element will be associated to an ancestor element, if one exists. This attribute enables you to associate elements to elements anywhere within a document, not just as descendants of elements.

例子:

<form id="firstForm">
     <button>Submit First form</button>
     <button form="secondForm">Submit Second form</button>
</form>

<form id="secondForm">

</form>