chrome setSelectionRange() no funciona en el controlador oninput

Question

Estoy trabajando con algún código de autocompletado. setSelectionRange() se usa para seleccionar el texto completado en el controlador de eventos oninput. Funciona al menos en Firefox 14, pero no en Chrome (6, 17).

simplificado fragmento de código que demuestra el problema es la siguiente:

<input type='text' oninput='select()' /> 

function select(e){ 
    var s = this.value; 
    if (s.length) 
     this.setSelectionRange(s.length-1, s.length); 
} 

I depurado el código en cromo, y resulta que se ha seleccionado texto en un primer momento justo después de la setSelectionRange() sido ejecutados , pero la selección desapareció más tarde.

Si Ato el manejador a onclick en lugar de oninput, así:

<input type='text' onclick='select()' /> 

entonces ambos navegadores funcionan bien.

¿Alguien puede darme alguna pista para hacer que la selección funcione en Chrome?

Answer 1

hay algunos problemas con su código, es decir, que los parámetros pasados ​​a la función select() están equivocados: this habrá window y e serán indefinidos. Además, usar select() como nombre de función dentro de los atributos oninput causa un problema porque select se resolverá con el método select() de la entrada en sí. Un mejor enfoque suele ser establecer el controlador de eventos en secuencia de comandos en lugar de establecerlo a través de un atributo de controlador de eventos.

Sin embargo, el problema existe incluso después de corregir estos problemas. Es posible que el evento input se dispare antes de que el navegador haya movido el cursor en Chrome. Una solución simple sería usar un temporizador, aunque esto no es óptimo porque existe la posibilidad de que el usuario pueda ingresar otro carácter antes de que el temporizador se dispare.

Demostración: http://jsfiddle.net/XXx5r/2/

Código:

<input type="text" oninput="selectText(this)"> 

<script type="text/javascript"> 
function selectText(input) { 
    var s = input.value; 
    if (s.length) { 
     window.setTimeout(function() { 
      input.setSelectionRange(s.length-1, s.length); 
     }, 0); 
    } 
} 
</script>