假设您在HTML表单中创建了一个向导。一个按钮后退，一个按钮前进。因为当您按Enter键时，返回按钮首先出现在标记中，它将使用该按钮提交表单。
例子:
< >形式 <！—将光标移至该字段，按“Enter”。—> <input type="text" name="field1" /> <！这是提交的按钮——> <input type="submit" name="prev" value="Previous Page" /> <！——但这是我想提交的按钮——> <input type="submit" name="next" value=" next Page" /> > < /形式
我想要确定当用户按Enter键时使用哪个按钮提交表单。这样，当您按下Enter键时，向导将移动到下一页，而不是上一页。你必须使用tabindex来做这个吗?
当前回答
我将使用JavaScript提交表单。该函数将由表单元素的OnKeyPress事件触发，并检测是否选择了Enter键。如果是这种情况，它将提交表单。
这里有两页给出了如何做到这一点的技巧:1、2。基于这些，下面是一个用法示例(基于这里):
<SCRIPT TYPE="text/javascript">//<!--
function submitenter(myfield,e) {
var keycode;
if (window.event) {
keycode = window.event.keyCode;
} else if (e) {
keycode = e.which;
} else {
return true;
}
if (keycode == 13) {
myfield.form.submit();
return false;
} else {
return true;
}
}
//--></SCRIPT>
<INPUT NAME="MyText" TYPE="Text" onKeyPress="return submitenter(this,event)" />
其他回答
这是我尝试过的:
你需要确保你给你的按钮不同的名字 编写if语句，在单击任意一个按钮时执行所需的操作。
<form>
<input type="text" name="field1" /> <!-- Put your cursor in this field and press Enter -->
<input type="submit" name="prev" value="Previous Page" /> <!-- This is the button that will submit -->
<input type="submit" name="next" value="Next Page" /> <!-- But this is the button that I WANT to submit -->
</form>
在PHP中,
if(isset($_POST['prev']))
{
header("Location: previous.html");
die();
}
if(isset($_POST['next']))
{
header("Location: next.html");
die();
}
给你的提交按钮设置相同的名称，就像这样:
<input type="submit" name="submitButton" value="Previous Page" />
<input type="submit" name="submitButton" value="Next Page" />
当用户按下Enter并将请求发送到服务器时，您可以在服务器端代码中检查submitButton的值，该代码包含一组表单名称/值对。例如，在ASP Classic中:
If Request.Form("submitButton") = "Previous Page" Then
' Code for the previous page
ElseIf Request.Form("submitButton") = "Next Page" Then
' Code for the next page
End If
参考:在一个表单上使用多个提交按钮
如果你在一个页面上有多个活动按钮，你可以这样做:
将您想要在Enter键上触发的第一个按钮标记为表单上的默认按钮。对于第二个按钮，将其关联到键盘上的退格键。Backspace eventcode是8。
$(document).on("keydown", function(event) { if (event.which.toString() == "8") { var findActiveElementsClosestForm = $(document.activeElement).closest("form"); if (findActiveElementsClosestForm && findActiveElementsClosestForm.length) { $("form#" + findActiveElementsClosestForm[0].id + " .secondary_button").trigger("click"); } } }); <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script> <form action="action" method="get" defaultbutton="TriggerOnEnter"> <input type="submit" id="PreviousButton" name="prev" value="Prev" class="secondary_button" /> <input type="submit" id='TriggerOnEnter' name="next" value="Next" class="primary_button" /> </form>
可以使用Tabindex来解决这个问题。此外，改变按钮的顺序将是实现这一目标的更有效方法。
更改按钮的顺序，并添加浮动值，将它们分配到您希望在HTML视图中显示的所需位置。
另一个简单的选项是将返回按钮放在HTML代码中的提交按钮之后，但将其浮动到左侧，这样它就会出现在提交按钮之前的页面上。
要做到这一点，只需改变制表符顺序即可。保持简单。
