El atributo de enfoque automático de HTML5 no funciona solo en FireFox cuando <Form><input> se cargan a través de Ajax. ¿POR QUÉ?

Question

A continuación se muestra el formulario que cargué a través de ajax. Cuando ejecuto la página de formulario directamente, el enfoque automático en c_name funciona en Firefox, pero cuando se carga con ajax no funciona. Sin embargo, funciona bien con Opera/Safari/Chrome.

<form action="client_entry_action.php" method="post" id="client_entry_form" name="client_entry_form"> 

<fieldset id="client_info_1"> 

    <label for="c_name">Name:</label> 
    <input type="text" name="c_name" required placeholder="Name" autofocus="autofocus" /> 

    <label for="c_phone">Phone Number:</label> 
    <input type="tel" name="c_phone" required placeholder="Mobile/Phone Number" /> 

    <label for="c_email">Email:</label> 
    <input type="email" name="c_email" required placeholder="email@example.com" /> 

    <label for="c_address">Address:</label> 
    <textarea name="c_address" ></textarea> 


</fieldset> 

<fieldset id="client_info_2"> 

    <label for="c_info">Additional notes:</label> 
    <textarea name="c_info" ></textarea> 

    <input type="submit" name="add_client" value="Add Client" /> 

</fieldset>   

</form> 

Answer 1

El enfoque automático solo se realiza antes de que la carga se haya disparado; está destinado a ser una forma declarativa de especificar el enfoque en la carga de la página inicial.

Answer 2

Tengo el mismo problema: el atributo Autofocus no funciona en FF, al menos en la última versión. También tengo una ventana emergente con un formulario. Ajax se usa para esta iniciación emergente.

espero que estos enlaces serán de utilidad para usted:

Discussion on webmasters.stackexchange.com

Another discussion on stackoverflow

pero no he descubierto ninguna solución parecía más sencillo y bueno, excepto por el uso de hacks javascript.

Answer 3

Sé que esto es viejo, pero acabo de tener este problema y tal vez ayuda a alguien.

Si utiliza jQuery esto funciona:

$("input[name='c_name']").focus(); 

Javascript sería algo como esto (ejemplo general):

document.getElementById('element').focus(); 

Pero hay que llamar a esa función después de su formulario se carga a través de AJAX !

Answer 4

uso setTimeout después de la llamada ajax en el div, o el uso de uso de jQuery .ajaxComplete o .done

function theAjax(){ 
//after the ajax actions loaded...... 
//use settimeout to refocused on the input.. 
var t=setTimeout("focusMe()",500); 

}

function focusMe(){ 
document.getELementById("theInput").focus(); //the new input 

}

//using jquery use .ajaxComplete, or .done 
$(document).ajaxComplete(function() { 
    $("#focusOnMe").focus(); 
}