Mottie Keyboard: изменение фокуса, когда поле ввода равно maxlength

Question

Я сделаю ввод автоматически, сменив фокус на следующий вход, если поле ввода равно maxlength. Поле ввода интегрировано с Mottie Keyboard. Можно ли сделать это?

Вот DEMO: JSFIDDLE

Если виртуальная клавиатура не используется, это легко использовать этот код:

$("input").bind("input", function() { 
     var $this = $(this); 
     setTimeout(function() { 
      if ($this.val().length >= parseInt($this.attr("maxlength"),10)) 
       $this.next("input").focus(); 
     },0); 
    }); 

Когда я совмещаю скрипт приведенный выше с Mottie клавиатурой, он не работает.

Answer 1

Я думаю, вы также открыли issue в хранилище?

Резюмируя свой ответ там, используйте change обратного вызова с помощью функции switchInput API выполнить то, что вам нужно (demo):

HTML (пример)

<input type="text" /> <!-- max len = 3 --> 
<input type="text" /> <!-- max len = 3 --> 
<input class="last" type="text" /> <!-- max len = 4 --> 

Script

$(function() { 
    $("input").keyboard({ 
    position: { 
     // position under center input 
     of: $("input:eq(1)"), 
     // move down 12px; not sure why it doesn't line up 
     my: 'center top+12', 
     at: 'center top' 
    }, 
    enterNavigation: true, 
    maxLength: 4, 
    layout: 'num', 
    autoAccept: true, 
    usePreview: false, 
    change: function(e, keyboard, el) { 
     var len = keyboard.$el.hasClass("last") ? 4 : 3; 
     if (keyboard.$el.val().length >= len) { 
     // switchInput(goToNext, isAccepted); 
     keyboard.switchInput(true, true); 
     } else if (keyboard.$el.val() === "" && keyboard.last.key === "bksp") { 
     // go to previous if user hits backspace on an empty input 
     keyboard.switchInput(false, true); 
     } 
    } 
    }); 
}); 

Answer 2

Попробуйте использовать, как это, Надеюсь, что это будет работать

$("input").on("focus blur", function() { 
    var $this = $(this), 
     value = $this.val(), 
     maxLength = $this.attr("maxlength"); 
    if (value.length >= maxLength ){ 
     $this.next("input").focus(); 
    }  
});