Почему форма с несколькими входами, без кнопок, не отправляется?

Question

Почему отправляется форма только с одним вводом текста (без каких-либо кнопок), но не с двумя вводами текста?

Пример: https://codesandbox.io/s/form-submitting-ztqpz?fontsize=14

Answer 1

вы можете сделать это разными способами,

лучше всего использовать tabindex для предотвращения доступа табуляции к этой кнопке -

<input type="submit" style="position: absolute; left: -9999px; width: 1px; height: 1px;" tabindex="-1" /> 

Также вы можете скрыть ссылку на эту кнопку. или вы можете пойти с функцией сценария Java, как это -

<script type="text/javascript">
// Using jQuery.

$(function() {
    $('form').each(function() {
        $(this).find('input').keypress(function(e) {
            // Enter pressed?
            if(e.which == 10 || e.which == 13) {
                this.form.submit();
            }
        });

        $(this).find('input[type=submit]').hide();
    });
});
</script>

Answer 2

Добавьте кнопку отправки в каждой форме (также несколько вводов), и она будет работать как с кнопкой, так и нажатием клавиши ввода

<div class="panel"> 
   <div class="panel-title">Few inputs</div>
      <form action=".">
        <input type="text" />
        <input type="text" />
        <button type="submit">Click</button>
        <output name="result" />
      </form>
   </div>
</div>