navigate form fields and edit text with the arrow keys

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" >

---

例如：

        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;

---

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

链接地址: http://www.djcxy.com/p/68450.html

上一篇: 输入数字后才能选择文本

下一篇: 导航表单域并用箭头键编辑文本