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" >
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;
textLength did not capture the field text length for me; I used event.target.value.length
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.