Question

我在Home / Index。我有以下HTML：

<form id="frmCode" style="display: inline-block">
    <input type="text" name="ConfirmationCode"/>
    <input type="button"/>
    <img src="~/Images/loading.gif" id="notificationLoading"/>
</form>

出于某种原因，如果我将光标放在ConfirmationCode输入中并按 Enter 键，表单将提交，并重定向到http://localhost:62500/?ConfirmationCode=。问题是，我已经读过这个行为了，我知道这可能是某种意图的行为，取决于浏览器和诸如此类的东西。但我有另一种形式，

<form id="frmLogin" class="form-horizontal" role="form">
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="col-sm-8">
        <input type="text" name="MailOrUsername" title="Te poți loga introducând mail-ul sau numele de utilizator"  data-val="true" data-val-required="De ce apeși aiurea? Bagă ID." class="form-control" placeholder="Mail sau ID" />
    </div>
    <div class="col-sm-8">
        <input type="password" name="Password" title="Introdu parola asociată contului tău"  data-val="true" data-val-required="Bagă parola." class="form-control" placeholder="Parola" />
    </div>
    <input type="checkbox" name="RememberMe" />
    <span title="Bifând căsuța asta rămâi autentificat și după ce închizi browserul">Ține-mă minte</span>
    <input type="button" onclick="login()" id="btnLogin" style="margin-top: 7px; margin-bottom: -5px" value="Intră" class="btn btn-info" />
    <input type="button" onclick="login_hide()" />
    <img src="~/Images/loading.gif" id="loginLoading" />
</form>

没有这种行为，按 Enter 键时没有任何反应。

Answer 1

表单提交是因为您的表单中只有1个输入（不需要输入其他数据）。

将您的第一张表格更改为：

<?php
  $f = fopen("/tmp/q", "w");
  $array = $_POST['results'];

  fwrite($f,"AAA");
  fwrite($f, $array[0]);
  fwrite($f, $array[1]);

  fclose($f);
?>

按Enter键时不会提交表单

如果要禁用表单的submition功能，可以像这样添加onsubmit事件处理程序：

<form id="frmCode" style="display: inline-block">
    <input type="text" name="ConfirmationCode"/>
    <input type="text" name="ConfirmationCode2"/>
    <input type="button"/>
    <img src="~/Images/loading.gif" id="notificationLoading"/>
</form>

Answer 2

您需要设置要用于将表单提交到submit的按钮类型。

<input type="submit" ...>

<form id="frmLogin" class="form-horizontal" role="form">
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="col-sm-8">
        <input type="text" name="MailOrUsername" title="Te poți loga introducând mail-ul sau numele de utilizator"  data-val="true" data-val-required="De ce apeși aiurea? Bagă ID." class="form-control" placeholder="Mail sau ID" />
    </div>
    <div class="col-sm-8">
        <input type="password" name="Password" title="Introdu parola asociată contului tău"  data-val="true" data-val-required="Bagă parola." class="form-control" placeholder="Parola" />
    </div>
    <input type="checkbox" name="RememberMe" />
    <span title="Bifând căsuța asta rămâi autentificat și după ce închizi browserul">Ține-mă minte</span>
    <input type="submit" onclick="login()" id="btnLogin" style="margin-top: 7px; margin-bottom: -5px" value="Intră" class="btn btn-info" />
    <input type="button" onclick="login_hide()" />
    <img src="~/Images/loading.gif" id="loginLoading" />
</form>

the input element和control types上的更多信息。

Answer 3

这是通常的浏览器行为，当用户在使用表单时按Enter键。

表单将提交，并且由于您的表单标记中没有操作属性，它将返回当前网址（附加任何表单字段/值）?ConfirmationCode=

正如“普遍存在的开发者”评论中提到的那样;您使用的是html按钮<input type="button"/>，而不是html提交按钮<input type="submit" />。这将没有提交按钮的默认行为。

你可能的脚本编写者不想使用html表单的默认行为。而是使用javascript来决定表单的行为方式。

我认为他们使用一些javascript来阻止提交这样的表单;

How to prevent ENTER keypress to submit a web form?

Answer 4

第一个表单是一个遵循默认浏览器规则的简单表单。规则是按Enter键意味着单击提交按钮。

＆＃13;

<input type="button"/>

＆＃13;

上面的

不是有效的提交按钮，因此浏览器会提交表单。
在第二种情况下，情景是不同的。

＆＃13;

 <input type="submit" onclick="login()" id="btnLogin" style="margin-top: 7px; margin-bottom: -5px" value="Intră" class="btn btn-info" />

＆＃13;

这是一个有效的提交按钮，因此在按回车键时，浏览器点击按钮，此按钮立即调用JavaScript函数＆＃34; login（）＆＃34;。现在它必须在代码中执行阻止表单提交的内容。可能是＆＃34;返回false;＆＃34;。所以表单doe snot提交。

Answer 5

You can try this. it works

<form method="post" action="yourpage.html">
<input type="text" name="name" class="inputbox" />
<button type="submit" id="btn1">Submit</button>
</form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"> 
</script>
<script>
$(".inputbox").on('keyup', function (e) {
 if (e.keyCode === 13) {
    $("#btn1").click();
 }
});
</script>

按Enter键时表单提交

5 个答案: