¿Puedo usar el enfoque automático en un elemento con contenteditable?

Question

Estoy usando el atributo contenteditable en un <div> para hacer que actúe como un campo de texto bajo demanda (para que los usuarios cambien el nombre de algo). Pero también quiero habilitar autofocus, para que los usuarios puedan comenzar a escribir de inmediato (el <div> siempre tiene habilitado inicialmente contenteditable).

¿Es esto válido y/o posible? ¿O tendré que cambiar a una entrada de texto estándar?

Answer 1

Tendrás que hacerlo con JavaScript en la mayoría de los navegadores, creo. Y no funcionará en iOS, que solo permite el uso programático de focus() en un controlador de eventos de una interacción real del usuario (como un evento relacionado con el tacto click).

Además, tenga en cuenta que si hay otras entradas en la página, es posible que el usuario se concentre en una de ellas antes de que el documento se haya cargado completamente, en cuyo caso es muy molesto para el usuario encontrar que el foco se ha movido debajo de ellos cuando el evento load se dispara, por lo que debe usar las entradas 'focus eventos para rastrear esto.

<div contenteditable="true" id="editable"></div> 

<script type="text/javascript"> 
    window.onload = function() { 
     document.getElementById("editable").focus(); 
    }; 
</script> 

Answer 2

Para los futuros espectadores:

Creo que puede tener una solución un poco más elegante.

$(window).on("load", function() { 
    $("[autofocus]").focus(); 
}); 

Así, una vez que se carga la página ... BAM jQuery se centra en el elemento con el 'enfoque automático' atribuir!

Puede jugar con el selector para obtener exactamente lo que desea.