2012-03-31 11 views
6

Aşağıda ajax ile yüklediğim form yer almaktadır. Form sayfasını doğrudan çalıştırdığımda c_name'de otomatik odaklama, firefox'ta çalışır ancak ajax ile yüklendiğinde olmaz! Yine de opera/safari/krom ile iyi çalışıyor!Otomatik Netleme HTML5 özniteliği, <Form><input> Ajax aracılığıyla yüklendiğinde yalnızca FireFox'ta çalışmaz. NİYE YA?

<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 protected]" /> 

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

cevap

6

Otomatik odaklama yalnızca yükün devreye girmesinden önce yapılır; İlk sayfa yüklemesinde odağı belirtmenin bildirimsel bir yolu olması gerekiyordu.

+0

Bu opera ile çalışıyor/safari/krom olsa! Biraz daha detaylandırır mısınız lütfen? – Vishu7

+5

Bu özellik, öznitelik için tam davranışı tanımlamamaktadır, bu nedenle ilgili tüm uygulamalar aslında uyumludur. _does_ özelliği, genel fikrin ne olduğunu açıklar ancak farklı tarayıcılar, farklı davranışlara neden olan davranışları yorumlar. –

0

Kesinlikle aynı sorun var: Autofocus özniteliği en geç en son sürümde FF'de çalışmıyor. Ayrıca form içeren bir pop-up pencerem var. Ajax bu pop-up başlatma için kullanılır.

Discussion on webmasters.stackexchange.com

Another discussion on stackoverflow

Ama javascript kesmek kullanılması dışında her daha basit ve iyi görünümlü çözüm bulamadı:

Ben bu bağlantıları size yardımcı olacağını umuyoruz.

1

Bunun eski olduğunu biliyorum, ama bu problemi çözdüm ve belki birilerine yardım ediyor. jQuery kullanıyorsanız

bu işleri:

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

JavaScript bu (genel örnekte) gibi bir şey olacaktır:

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

Ama eğer formu ajax ile yüklendikten sonra bu işlevi çağırmak zorunda !

5

kullanım div üzerinde ajax arama ya kullanarak jquery kullanımı .ajaxComplete sonra setTimeout veya .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(); 
} 
İlgili konular