提交按钮和输入验证？

Question

我想更改此代码以使其在按下 Enter 时也能更清楚地工作我得到了一个提交表单和一个文本字段，其后是必须单击才能提交的提交按钮，但这无济于事我出去了，因为我需要在按下回车键时识别表格，整理它会有什么变化？

submitButton.onclick = function() {
  index    = 0;
  results  = [];
  username = usernameInput.value;
  if ( username.length > 0 ) {
     window.location.href   = '//' + window.location.host + window.location.pathname + '#' + username;
     usernameInput.disabled = true;
     submitButton.disabled  = true;
     getExistence();
  }

此外，我还遇到了输入验证问题，我应该进行哪些更改才能让表单识别并接受特殊字符？

 usernameInput.onchange = function() {
  this.value = this.value.replace(/[^a-z0-9]+/ig, '').slice(0, 40);


var urlUsername          = window.location.href.match(/\#([0-9a-z]{1,40})$/i)

由于我是 javascript 编码的新手，我会要求您更具体一些，而且我的知识不足以轻松对其进行排序。

Answer 1

第一个解决方案是阅读这个。 https://www.tjvantoll.com/2013/01/01/enter-should-submit-forms-stop-messing-with-that/

您了解为什么 "button type="提交”比将其添加到 JS 中更好。我认为，您的问题的解决方案可能是这样的：

<form>
    <label for="age">Age:</label>
    <input type="number" min="0" max="120" name="age" id="age">
    <button id="child">Child</button>
    <button id="adult">Adult</button>
</form>
<script>
    (function() {
        var age = document.getElementById('age');
        age.addEventListener('keypress', function(event) {
            if (event.keyCode == 13) {
                event.preventDefault();
                if (age.value > 20) {
                    document.getElementById('adult').click();
                } else {
                    document.getElementById('child').click();
                }
            }
        });
    }());
</script>

简而言之，评论您的代码：

submitButton.onclick = function() { ... your code

如您所描述的那样工作，onclick。您可以使用类似的功能：

submitButton.onkeypress = function() { ... same code with checking keyCode as example above

验证：创建任何正则表达式的最简单方法是进行一些实际测试。我个人更喜欢这个网站：https://regex101.com/

什么是“特殊”字符？因为现在没人能帮忙。此特定示例中的更多信息。您只是不需要 JS 的任何 RegEx。接受任何字符并在后端执行所有操作。

提交按钮和输入验证？

Submit button and input validation?

javascript

character

submit

button