除非启用JavaScript,否则请勿提交表单

Question

我有一个我用于会员注册的基本表格.我正在使用表单onsubmit事件来填充基于某些表单字段的隐藏表单字段.它工作得很好,但是如果没有启用javascript,我想阻止表单提交.这将确保隐藏字段在客户端计算机上正确填充.

我意识到在没有启用javascript的情况下支持注册可能是最好的做法,但我想运行我现有的解决方案

<form id='member_form' method="post" action="http://www.mysite.com/" onsubmit="build_username();" >

Answer 1

如果他们需要javascript来提交表单,那么甚至没有必要向他们展示表单.

鉴于此,我建议这样的事情

<noscript>
  You cannot register without javascript enabled.
</noscript>

<form id="registration" style="display: none">
  <!-- form stuff here -->
</form>

<script type="text/javascript">
  document.getElementById( 'registration' ).style.display = 'block';
</script>

它有点俗气和黑客,但那么需要javascript的简单的Web表单.

Answer 2

问题是表单默认是可提交的。

您不能删除表单的action属性并在以后使用 JavaScript 添加它，因为浏览器随后会将当前页面用作action，并且表单仍然可以提交。

此外，删除“提交”按钮也没有帮助，因为仍然可以使用该enter键提交表单。

但是，我向你提交（不是双关语！）这个邪恶的想法：

<form action="#">
  ....
</form>

这使得表单一开始实际上无法提交，因为提交目标是当前页面。

然后，您可以action使用 JavaScript 设置正确的属性。

我想不出为什么这不能跨浏览器可靠地工作的任何原因，除了尝试提交它会使浏览器由于 hash 而跳转到页面顶部#。