对表单和提交按钮感到困惑

如何解决对表单和提交按钮感到困惑

| 我的表单如下：

<html>
<head>
<title>My Page</title>
</head>
<body>
<form name=\"myform\" action=\"http://www.abcdefg.com/my.cgi\" method=\"POST\">
<div align=\"center\">
<br><br>

<br><input type=\"submit\" value=\"ABC\" tabindex=0><br>
<br><input type=\"button\" value=\"cancel\"><br>
</div>
</form>
</body>
</html>

我希望在按下ENTER按钮时提交表单，并且还希望“提交”按钮周围有一些颜色来表示它是默认的。但是似乎我必须单击选项卡按钮以使提交周围有蓝色作为默认值。是否有某种方法可以使“提交”按钮始终是默认按钮，并始终在其周围带有一个蓝色圆圈以表明这一点？如果我在相同的html页面上还有其他输入字段但不在默认值之内，该怎么办。我需要的是无论我在该页面上的什么位置，在我按Enter键时始终提交表单。有什么办法可以做到这一点？

解决方法

对于您的“随处输入”提交，我将使用jQuery。一点点搜索导致我想到了这一点：用jQuery在“ Enter”上提交表单？ , 提交应始终为默认值-在表单集中显示时，这很困难，因为您没有真正的“ 1”字段。这种形式实际上是做什么的？除此之外，不要覆盖浏览器的默认UI行为：您只会混淆用户。 , 在表单上，只有当前关注的元素具有蓝色轮廓，这通常是依赖于平台的功能。话虽如此，您可以使用一些CSS来定制该轮廓，以使表单在浏览器中看起来保持一致：

form *:focus {
    outline:2px solid blue;
}

现在，要使“提交”按钮始终显示该轮廓，我将其取为classѭ4give：

<input type=\"submit\" value=\"ABC\" tabindex=\"0\" class=\"default\">

然后更改上述CSS以包括该类：

form *:focus,input.default {
    outline:2px solid blue;
}

至于按回车键提交表单：只要表单中的某个元素具有焦点，按回车键将默认提交表单。如果您希望在表单没有焦点的情况下发生这种情况，则需要使用一些JavaScript，但我不建议这样做，因为正如Tomalak在他的回答中所说，您不应更改浏览器的默认行为。 , 如果使用Jquery，则可以将事件处理程序附加到标记HTML（或文档本身）上。由于事件使DOM泛滥，因此即使它在表单之外，也会对其进行感知。然后，如果按下的键是RETURN，则提交表单。

$(document).keyup(function(event){
    if (event.keyCode == 13){
         $(\'form[name=myform]\').submit();
     }
});

, 您可以将其放入身体负荷并将提交的ID设置为mysubmit

document.getElementById(\"mysubmit\").focus();

和

<br><input type=\"submit\" value=\"ABC\" tabindex=0 id=\"mysubmit\"><br>

编辑：看来我部分理解了这个问题。我可以提供另一部分解决方案，因为您实际提出的要求可能无法实现。您可以捕获文档按键，并自己调用函数。但是，这不会显示该按钮处于活动状态。除此之外，如果用户使用文档鼠标事件在其他位置单击其他按钮，则可以重新调整按钮的位置。但我建议您不要这样做。更好的方法可能是使用专门显示您想要的按钮始终处于活动状态的图像字段。请问您为什么需要这个？

对表单和提交按钮感到困惑

如何解决对表单和提交按钮感到困惑

解决方法

相关推荐