テキストボックスの最後の文字の後にフォーカスを設定する

質問

電話番号のテキストボックスが3つあります。 ユーザーが入力すると、1つのテキストボックスから次のテキストボックスに自動的に移動します。 ユーザーがバックスペースを押すと、前のテキスト ボックスにフォーカスを移動させることができます。 問題は、IEでは、フォーカスがテキストボックスの先頭に設定されていることです。 以下は私のコードで、クロームでは問題なく動作します。

$('#AreaCode').live('keyup', function (event) {
    if ($(this).val().length == $(this).attr("maxlength"))
        $('#Prefix').focus();
});

$('#Prefix').live('keyup', function (event) {
    if (event.keyCode == 8 && $(this).val().length == 0)
        $('#AreaCode').focus();

    if ($(this).val().length == $(this).attr("maxlength"))
        $('#Number').focus();
});

$('#Number').live('keyup', function (event) {
    if (event.keyCode == 8 && $(this).val().length == 0)
        $('#Prefix').focus();
});

逆方向へ進むとき、フォーカスをコンテンツの最後に設定させるには？

どのように解決するのですか？

これは簡単な方法です。逆方向の場合は、単に $("#Prefix").val($("#Prefix").val()); を追加してください。

この方がより正しい（きれいな）方法です。

function SetCaretAtEnd(elem) {
        var elemLen = elem.value.length;
        // For IE Only
        if (document.selection) {
            // Set focus
            elem.focus();
            // Use IE Ranges
            var oSel = document.selection.createRange();
            // Reset position to 0 & then set at end
            oSel.moveStart('character', -elemLen);
            oSel.moveStart('character', elemLen);
            oSel.moveEnd('character', 0);
            oSel.select();
        }
        else if (elem.selectionStart || elem.selectionStart == '0') {
            // Firefox/Chrome
            elem.selectionStart = elemLen;
            elem.selectionEnd = elemLen;
            elem.focus();
        } // if
    } // SetCaretAtEnd()