Нажать клавишу ввода изменить позицию курсора javaScript?

У меня есть форма с двумя текстовыми полями и onLoad="document.forms.obrazac.sifra.focus()" Я положил курсор на первое поле. Теперь я хочу, чтобы пользователь нажал клавишу ввода, чтобы сфокусировать курсор на втором поле, а затем, когда вводится снова, я хочу отправить свою форму. Как я могу это сделать, спасибо.Нажать клавишу ввода изменить позицию курсора javaScript?

источник

2012-05-22 Wolf87

Просто мои 2 цента, но ломка поведения браузера по умолчанию не является плохой практикой. – Snuffleupagus

Что я могу сделать вместо этого? – Wolf87

Ключ вкладки по умолчанию будет проходить через ваши элементы ввода форм, а ключ ввода по умолчанию отправит форму. Лучше оставить его таким образом, если это не является конкретным ограничением проекта. – Snuffleupagus

Определенно нехорошо нарушать поведение по умолчанию. Кстати, вы знаете атрибут autofocus в HTML?

Если вы абсолютно необходимо это, здесь вы идете:

document.forms.obrazac.onkeypress = function(e) { 
    // If the hit key is "Enter" 
    if (e.keyCode === 13) { 

     // Cross-browser handling for our dear friend @MaxArt :p 
     var evt = e || window.event, 
      target = evt.target || evt.srcElement, 

     // Find the next input 
      nextInput = target.nextSibling; 
     while (nextInput.tagName !== 'INPUT' && nextInput.nextSibling) { 
      nextInput = nextInput.nextSibling; 
     } 

     // And focus it 
     nextInput.focus(); 

     // Finally, disable submitting IF there is no input after 
     if (nextInput !== this.elements[ this.elements.length - 1 ]) { 
      return false; 
     } 
    } 
};

источник

2012-05-22 14:45:31

1. Традиционное прослушивание событий не рекомендуется. 2. 'nextElementSibling' не поддерживается IE8-. 3. Так что 'e.target' - нет. – MaxArt

1. Wut? Где вы это видели? 2/3: Конечно. –

@MaxArt Хорошо, я отредактировал для ваших кросс-браузерных проблем :) –

-1

Попробуйте это:

document.forms.obrazac.sifra.addEventListener("keyup", function(e) { 
    if (e.keyCode === 13) { // 13 === enter key 
     e.preventDefault(); 
     this.nextSibling.focus(); 
    } 
});

виду эти вещи:

я использовал addEventListener, но в IE8 и старше вы должны использовать attachEvent("onkeyup"... и проверить глобальный объект event. Кроме того, e.preventDefault(); становится e.returnValue = false;
Я предположил, что this.nextSibling - следующее поле. Исправьте это, чтобы соответствовать вам DOM.

источник

2012-05-22 14:46:55 MaxArt

1. 'keyup' - худшее событие для присоединения. 2. Даже если следующее поле сразу после, 'nextSibling', скорее всего, получит textNode. 3. '' '' '' document.forms.obarazac.sifra', а не элемент, вызвавший событие. –

1. Пожалуйста, объясните. 2. «Вероятно» - это не то же самое, что «конечно». Я сказал, что должен. 3. 'document.forms.obarazac.sifra', если это, по-видимому, поле ввода, это именно то, что вызвало событие. – MaxArt

1. http://whattheheadsaid.com/2010/09/effectively-detecting-user-input-in-javascript 2. «Скорее всего» - это «большую часть времени» :). 3. В первый раз, да. Не во второй раз. –

Я бы не нарушить поведение по умолчанию, это очень раздражает и нелогичным для пользователей, но если вы действительно хотите сделать это, вы могли бы сделать что-то подобное с JQuery:

$('#form').keydown(function(e) { 
    if(e.keyCode === 13) { // When "Shift + Enter" 
     e.preventDefault(); 
     // focus on next field here. 
    } 
});

Вместо делать это, вы бы лучше просто сделать правильный порядок табуляции, как это (с TabIndex):

<input type="text" name="field1" tabindex=1 /><br />

источник

2012-05-22 14:48:39

Просто короткий не НАСТОЯЩЕМУ testet образец ... просто дать и идею:

<head> 
    <script type="text/javascript"> 
    function onKeyPress(args) 
    { 
     if(args.keyCode === 13) 
      document.getElementById("tb2").focus(); 
    }  
    </script> 
</head> 
<body> 
    <input type="text" onkeypress="onKeyPress(event);" id="tb1" /> 
    <input type="text" id="tb2" /> 
</body>

Вы могли бы сделать то же самое на ТВ2 представить форму там на «ENTER» Я также хотел бы использовать что-то вроде JQuery, чтобы связать события в JavaScript, а не непосредственно в разметке.

Надеюсь, это поможет.

@as я начал создавать свой образец там, где нет ответов =)

источник

2012-05-22 15:07:21

Нажать клавишу ввода изменить позицию курсора javaScript?

ответ

Смежные вопросы