Как захватить ввод ключа нажатием на страницах, содержащих несколько форм?

Ответ 1

содержит несколько форм, а приложение не сможет определить (или, как мне сказали), формы к действию.

Когда вы нажимаете кнопку ввода на входе, браузер ищет первую кнопку отправки в этой форме и имитирует клик по ней. В случае нескольких кнопок первый будет нажат на клавиатуре (это ни в коем случае не написано на камне, и браузеры могут отклоняться от этого).

Если у вас две формы, тот, у кого есть нажатие клавиши, будет нажата первая кнопка отправки. Поэтому вам не нужна особая обработка этого. Вам просто нужно перестать мешать.

Вы можете имитировать это в коде, в форме:

 $( 'form' ).bind('keypress', function(e){
   if ( e.keyCode == 13 ) {
     $( this ).find( 'input[type=submit]:first' ).click();
   }
 });

Или окно (для демонстрации того, что происходит примерно):

 $( window ).bind('keypress', function(e){
   if ( $( e.originalTarget ).is( ':input' ) && e.keyCode == 13 ) {
     $(  e.originalTarget )
       .closest( 'form' )
         .find( 'input[type=submit]:first' )
           .click();
   }
 });

Предполагая, конечно, что .preventDefault() не было вызвано на событие.

Итог: если у вас есть событие, вы можете божественным из него, из какого элемента он пришел, и поэтому в какой форме он принадлежит. Даже в этом случае:

<input type="button" value="LOGIN" name="btnLoginOk" onclick="submit();">

Здесь submit() - глобальная функция, но когда она вызывается, ее контекст (this) будет элементом, и вы можете сделать submit(e){ this.form.submit(); }.

Приложение разработано так, что нет кнопок отправки (как во входных type = "submit" ), и вместо этого дизайнеры отправились на обработку onclick.

Это звучит для меня так, как дизайнер не полностью понимает события DOM/form и идет далеко от проблемы. Другая вероятная причина может заключаться в том, что программа старая и была разработана, когда эти вещи были не совсем стабильны или правильно документированы, как сегодня.

Замените это:

<form action="/login/" method="POST">
  [...]
  <input type="button" value="LOGIN" name="btnLoginOk" onclick="submit();">
</form>

При этом:

<form action="/login/" method="POST">
  [...]
  <input type="submit" value="LOGIN" name="btnLoginOk">
</form>

Затем добавьте обработчик ключей ко всем формам, которые в нем нуждаются, которые обнаруживают и подавляют ввод, если выполняется какое-либо условие (для форм, которые вы действительно хотите отключить).

// for all forms that POST that have 2+ submit buttons
$( 'form[method=post]:has(:submit:eq(1))' ).bind('keydown', function(e){
  // if target is an enter key, input element, and not a button
  if ( e.keyCode == 13 && e.target.tagName == 'INPUT' && 
       !/^(button|reset|submit)$/i.test( e.target.type ) ) {
    return false;  // kill event
  }
});

Или еще лучше: используйте библиотеку проверки формы (или плагин jQuery), которая знает, как сделать это для вас.

Ответ 2

Пальцы, пересекающие это, будут работать

$(document).ready(function() {
  var focussed_form;
  $('input').focus(focus_form);
  $('input').blur(unfocus_form);
  $('textarea').focus(focus_form);
  $('textarea').blur(unfocus_form);
  $('select').focus(focus_form);
  $('select').blur(unfocus_form);

  $(document).keypress(function(e) {
    if(e.keyCode == 13) 
    {
      $(focussed_form).trigger('submit'); 
    }
  });

  function focus_form(){
    focussed_form = $(this).closest('form');
  }

  function unfocus_form(){
    focussed_form = NULL;
  }

});

Ответ 3

Я не думаю, что для этого вам нужен jQuery или javascript. Вы действительно можете обнаружить, какая форма, на которую попадает пользователь, отправляется, или даже нажата кнопка отправки (в случае, если на форму имеется более одной кнопки отправки).

Здесь код, который вы использовали бы:

<form action="http://foo.com/uri" method="POST">
  <input type="submit" name="action1a" value="add" />
  <input type="submit" name="action1b" value="delete" />
</form>
<form action="http://foo.com/uri" method="POST">
  <input type="submit" name="action2a" value="add" />
  <input type="submit" name="action2b" value="delete" />
  <input type="submit" name="action2c" value="someOtherAction" />
</form>

Затем для обработки формы script вы просто проверите имя кнопки отправки, например:

if (isset($_POST['action1a'])) ... // PHP syntax

В качестве альтернативы вы можете использовать изображения в качестве кнопок отправки, тогда вы можете использовать одно и то же имя для всех кнопок отправки и просто проверить их значения - вы также можете сделать это с помощью обычных кнопок отправки, если каждая кнопка имеет уникальный value атрибут.

<form action="http://foo.com/uri?form=1" method="POST">
  <input type="submit" name="action" value="add" />
  <input type="submit" name="action" value="delete" />
</form>
<form action="http://foo.com/uri?form=2" method="POST">
  <input type="submit" name="action" value="add" />
  <input type="submit" name="action" value="delete" />
</form>

Ответ 4

Вы можете связать событие нажатия клавиши для клавиши Enter в jquery:

$("form").bind("keypress", function(e) {
   if (e.keyCode == 13) {
      your_custom_submit_function();
      return false; // ignore default event
   }
});