纯HTML无法做到这一点。要做到这一点，必须依赖JavaScript。

但是，如果在HTML页面上放置两个表单，则可以做到这一点。

Form1将拥有前面的按钮。

Form2将有任何用户输入+下一个按钮。

当用户在Form2中按下Enter键时，Next提交按钮将触发。

你可以用CSS来做。

首先在标记中放入Next按钮，然后是Prev按钮。

然后使用CSS来定位它们以显示您想要的方式。

当我第一次遇到这种情况时，我想出了一个onclick()/JavaScript hack，当选择不是prev/next时，我仍然喜欢它的简单性。它是这样的:

@model myApp.Models.myModel

<script type="text/javascript">
    function doOperation(op) {
        document.getElementById("OperationId").innerText = op;
        // you could also use Ajax to reference the element.
    }
</script>

<form>
  <input type="text" id = "TextFieldId" name="TextField" value="" />
  <input type="hidden" id="OperationId" name="Operation" value="" />
  <input type="submit" name="write" value="Write" onclick='doOperation("Write")'/>
  <input type="submit" name="read" value="Read" onclick='doOperation("Read")'/>
</form>

当单击任何一个提交按钮时，它将所需的操作存储在一个隐藏字段中(该字段是包含在与表单关联的模型中的字符串字段)，并将表单提交给控制器，由控制器进行所有决定。在控制器中，你只需写:

// Do operation according to which submit button was clicked
// based on the contents of the hidden Operation field.
if (myModel.Operation == "Read")
{
     // Do read logic
}
else if (myModel.Operation == "Write")
{
     // Do write logic
}
else
{
     // Do error logic
}

您还可以使用数值操作代码来避免字符串解析，但是除非使用枚举，否则代码可读性较差、可修改性较差、自文档性较差，解析也很简单。

与其纠结于多次提交，JavaScript或类似的东西来做一些上/下的事情，另一种选择是使用旋转木马来模拟不同的页面。 这样做:

你不需要多个按钮，输入或提交来做上一个/下一个事情，你只有一个输入类型="submit"在只有一个形式。 整个表单中的值一直存在，直到表单提交为止。 用户可以切换到任何上一页和下一页来完美地修改值。

使用Bootstrap 5.0.0的示例:

<div id="carousel" class="carousel slide" data-ride="carousel">
    <form action="index.php" method="post" class="carousel-inner">
        <div class="carousel-item active">
            <input type="text" name="lastname" placeholder="Lastname"/>
        </div>
        <div class="carousel-item">
            <input type="text" name="firstname" placeholder="Firstname"/>
        </div>
        <div class="carousel-item">
            <input type="submit" name="submit" value="Submit"/>
        </div>
    </form>
    <a class="btn-secondary" href="#carousel" role="button" data-slide="prev">Previous page</a>
    <a class="btn-primary" href="#carousel" role="button" data-slide="next">Next page</a>
</div>

我认为这是一个简单的解决方法。将Previous按钮类型更改为button，并添加一个新的onclick属性，值为jQuery(this).attr('type'，'submit');

因此，当用户单击Previous按钮时，它的类型将被更改为submit，表单将与Previous按钮一起提交。

<form>
  <!-- Put your cursor in this field and press Enter -->
  <input type="text" name="field1" />

  <!-- This is the button that will submit -->
  <input type="button" onclick="jQuery(this).attr('type','submit');" name="prev" value="Previous Page" />

  <!-- But this is the button that I WANT to submit -->
  <input type="submit" name="next" value="Next Page" />
</form>

我只是让按钮向右浮动。

这样，Prev按钮在Next按钮的左边，但在HTML结构中Next在前面:

.f { 浮:正确; ｝ .clr { 明确:; ｝ <form action="action" method="get"> <input type="text" name="abc"> < div id = "按钮" > <input type="submit" class="f" name="next" value=" next" > <input type="submit" class="f" name="prev" value=" prev" > < div class = " clr " > < / div > < !这个div可以防止后面的元素随按钮一起浮动。保持他们“内部”div#按钮—> < / div > > < /形式

优于其他建议的优点:没有JavaScript代码，可访问，两个按钮都保持type="submit"。