导航表单字段并使用箭头键编辑文本

Question

I have a script in a form of a website, where pressing the enter key or the right arrow changes focus to the next field, or by pressing the Left arrow changes focus to the previous field.

I need to be able to use the arrow keys to change the cursor position while editing the text, without change the field focus and only go to the next field when the cursor is at the beginning or end of the text.

how i can make this?

The script code is as follows:

function tabulacion_manual(e,adelante,atras,saltar){
    if(saltar==1)
    {
        setTimeout(function(){
            $(adelante).focus();
            $(adelante).select();
        },150);
    }else{
        //tecla = (document.all) ? e.keyCode : e.which;
        tecla = (window.event) ? window.event.keyCode : e.keyCode;

        switch(tecla){
            case 37: //atras
                $(atras).focus();
                break;
            case 38: //arriba
                $(atras).focus();
                break;
            case 40: //abajo
                $(adelante).focus();
                break;
            case 39: //derecha
                $(adelante).focus();
                break;
            case 13: //enter
                $(adelante).focus();
                break;
        }
    }
    return true;
}

the html code is:

<s:textfield name="programaFaena.fecha"  maxlength="10" tabindex="1" onkeypress="return tabulacion_manual(event,this,next())" autocomplete="off" readonly="false" >

Answer 1

For example:

        case 37: //atras
            //if the cursor is at the beginning of the field
            if (event.target.selectionEnd == 0) {
                $(atras).focus();
            }
            break;
        ...
        case 39: //derecha
            //if the cursor is at the end of the field
            if (event.target.textLength-event.target.selectionStart == 0) {
                $(adelante).focus();
            }
            break;

Answer 2

textLength did not capture the field text length for me; I used event.target.value.length