Форма отправляется только при наличии одного ввода

Question

У меня есть элемент <form>, окружающий несколько входов:

<form>
  <div class="tr" id="widget306">
    <div class="td col-grab">

        <button type="button" class="button grab formwidget" id="widget611">m</button>

    </div>

    <div class="td col-name">

        <input type="text" name="name" value="target volume profile 1" id="widget607" class="formwidget textbox">

    </div>
    <!-- ... etc ... -->
  </div>
</form>

Я хотел бы вызвать событие отправки в форме, когда пользователь нажимает клавишу ввода, фокусируясь на элементе (стандартное поведение для элементов ввода, заключенных в тег <form>), но когда я нажимаю клавишу ввода, ничего не происходит ( скрипка ). Если я удаляю все элементы ввода, кроме одного, код работает, и я получаю ожидаемое поведение нажатия клавиши ВВОД и запуска отправки формы ( fiddle ).

Как получить желаемое поведение (нажатие клавиши ввода отправляет форму) в первом примере, где у меня есть несколько форм?

Примечание. Такое же поведение я обнаружил в Safari 5.1, Chrome 17, Firefox 9 и IE 9.

Разъяснение: Я знаю, что могу просто добавить немного Javascript, но я бы хотел решить эту проблему с помощью только разметки.

Обновление: , как некоторые из вас любезно отметили, я могу получить желаемое поведение, добавив <input type=submit>. Проблема в том, что я не хочу, чтобы пользователь видел кнопку отправки. Я не могу просто установить для display значение none, потому что браузеры не будут отправлять при нажатии return, поэтому я позаимствовал у QUnit и установил следующее:

HTML:

<input type=submit class=hide-me />

CSS:

.hide-me {
  position: absolute;
  left: -10000px;
  top: -10000px;
}

Answer 1

Я заметил, что формы не любят отправлять без кнопки отправки.Проблема просто решается добавлением кнопки отправки.Посмотрите эту скрипку для демонстрации.Кроме того, браузеры отправляют, когда пользователь нажимает ввод по умолчанию, поэтому исправьте это, и вам не понадобится триггер javascript, чтобы вызвать его.<input type="submit"> просто потому, что это недостатки стиля, рассмотрим <button type="submit">, это также должно помочь.Если вы просто не хотите кнопку отправки, используйте CSS-хак.

Answer 2

Попробовав сам, я тоже не мог поверить.

Похоже, это проблема:

Почему формы с одним полем ввода отправляются после нажатия клавиши ввода при вводе

Answer 3

Попробуйте это. я использую это на моем textarea с tinymce для системы чата

<script>
function getKeystroke(e)
{
  var keynum;


  keynum = (window.event) ? event.keyCode : e.keyCode;



  switch(keynum)
  {
     case 13:  /* enter key */
        document.getElementById("s_say").click();
        document.getElementById("s_message").focus();

        break;
  }

}
</script>

s_say - идентификатор типа ввода submit btn.

Answer 4

1. Добавление элемента <input type="submit" name="xx" value="submit" />, оно автоматически запускает режим отправки.
2. Вы также можете использовать jQuery для обработки события нажатия.

Шон.

Answer 5

По умолчанию браузеры автоматически отправляют простые формы (например, поисковые), поэтому они работают при наличии только одного ввода.Я считаю, что если вы хотите эту функциональность на сложных формах, вам нужно будет использовать JavaScript.Если вы не против использования jQuery, вам нужно выполнить следующее:

$(function(){ 
     $("#formid input").keypress(function(event){
         if (event.which = 13){
             $("#formid").submit();
         }
     }
}