Сосредоточиться на следующем вводе после нажатия клавиши вверх с помощью Jquery - PullRequest
Новая
       22

Сосредоточиться на следующем вводе после нажатия клавиши вверх с помощью Jquery

2 голосов
/ 28 августа 2011

Примечание. На моей странице только текстовые поля.Ничего больше.(ничего другого => нет других типов ввода) 

 $(":input[type='text']").keyup(function(event){

   if(valid)
     {
         // take a focus to next input element, which is again a text type.
     }

  });

Как я могу перейти к следующему элементу ввода после нажатия клавиши.

После Sarfraz Ответ: - 

 <div>
   <input type="text" maxlength="1" size="1" >
   <input type="text" maxlength="1" size="1" > 
   <input type="text" maxlength="1" size="1" > // sarfraj -- here it crash   Please check below for error.
 </div>


 <div>
   <input type="text" maxlength="1" size="1" >
   <input type="text" maxlength="1" size="1" >
   <input type="text" maxlength="1" size="1" >
 </div>

Из клопа выдается 

  $(this).next("[type=\"text\"]")[0] is undefined
  [Break On This Error] $(this).next('[type="text"]')[0].focus();

Ответы [ 2 ]

5 голосов
/ 28 августа 2011

Обновление:

Вот как вы должны изменить свой код: 

$(":input[type='text']").keyup(function(event){
   if(valid) {
      if ($(this).next('[type="text"]').length > 0){
         $(this).next('[type="text"]')[0].focus();
      }
      else{
         if ($(this).parent().next().find('[type="text"]').length > 0){
            $(this).parent().next().find('[type="text"]')[0].focus();
         }
         else {
           alert('no more text input found !');
         }
      }

   }
});

Как я могу перейти к следующему элементу ввода после нажатия клавиши вверх.

Используйте next() с focus: 

$(this).next('[type="text"]')[0].focus();

Вот как должен выглядеть ваш код: 

$(":input[type='text']").keyup(function(event){
   if(valid) {
      $(this).next('[type="text"]')[0].focus();
   }
});
3 голосов
/ 28 августа 2011

Свойство html tabindex используется для определения порядка, в котором вы перемещаетесь по элементам ввода, если нажимаете кнопку Tab.Я бы начал с установки этого.

Итак, установите индексы вкладок затем (чтобы расширить ваш пример): 

 $(":input[type='text']").keyup(function(event){
   if(valid)
     {
         var currentIndex = $(this).attr("tabindex");
         var nextIndex = parseInt(currentIndex)+1;
         $("input[tabindex='"+nextIndex+"']").focus();
     }
  });

В основном получите tabindex текущего элемента, добавьте 1и получить элемент с указателем этой вкладки.

...