2012-02-16 13 views
6

Sto tentando di scrivere una JQuery per mettere a fuoco la prima casella di testo o area di testo visibile nel visibile nella casella di testo quando si carica una pagina. Nell'esempio seguente, concentrarsi sull'input text2 in form2.JQuery si concentra sulla prima casella di testo o area di testo quando la pagina viene caricata

La soluzione proposta in jQuery Dynamically focus on the first INPUT or Textarea non funziona per me.

Si prega di notare che abbiamo più pagine nella nostra applicazione. In alcune pagine il primo campo del modulo è una casella di testo e in altre pagine il primo campo è una textarea. Voglio scrivere un metodo JQuery che farà il lavoro per tutte le pagine indipendentemente dal fatto che il primo campo sia una casella di testo o un'area di testo. Nell'esempio seguente, la soluzione dovrebbe funzionare se si scambiano i campi textarea1 e text2.

<div id="header"> 
    <form name="form1"> 
    <input type="text" name="text1"> 
    </form> 
</div> 
<div id="content"> 
    <form name="form2"> 
    <input type="checkbox" name="chc" value="test"><br> 
    <input type="hidden" name="hide"> 
    <input type="text" name="text2"><br> 
    <textarea name="textarea1"></textarea><br> 
    <input type="text" name="text3"> 
    </form> 
</div> 

Questo è quello che ho provato finora ...

// throws the error - $("#content input:text, #content textarea").first is not a function 
$("#content input:text, #content textarea").first().focus(); 

// focuses on the textarea even if a text box is the first element in the form 
$("#content textarea, #content[type='text']:visible:enabled:first").focus(); 

// focuses on the last text box in the page! 
$("#content :input[type='text'], :textarea:visible:enabled:first").focus(); 

// focuses on the first text box even if a textarea is the first element in the form 
$("#content :input[type='text']:visible:enabled:first, :textarea:visible:enabled:first").focus(); 

// focuses on the checkbox as it is the first input element 
$('#content :input:visible:enabled:first').focus(); 

Grazie.

risposta

8
$("#content input:text, #content textarea").eq(0).focus() 
+0

Grazie Adam! Questo ha funzionato. – neo108

+0

In qualsiasi momento @ neo108:] –

0

Si consiglia di utilizzare l'elemento DOM invece dell'oggetto jQuery, in questo modo:

$("#content input:text")[0].focus() 
3

Ecco quello che vi serve:

​$(function(){ 
    $('form[name=form2]').find(':text, textarea').filter(":visible:enabled").first().focus(); 
})​ 

Un esempio here

+0

Ciao Rafael, grazie, funziona ma non posso fare riferimento al nome del modulo in quanto il nome del modulo differisce in ogni pagina. Il div id "contenuto" è lo stesso in tutte le pagine. È possibile utilizzare l'ID div al posto del nome del modulo? – neo108

+0

Assolutamente, @ neo108 ... il selettore del contenitore può essere chiunque scarta il primo modulo, quindi $ ('# contenuto') potrebbe essere usato:] –

0

// genera l'errore - $ ("# content input: text, #content textarea "). First non è una funzione $ (" # content content: text, #content textarea "). First(). Focus();

Questo dovrebbe funzionare correttamente. Controlla la tua versione di jQuery, first method aggiunto il JQuery 1,4

1
<script type="text/javascript"> 
$(document).ready(function() { 
    // focus on the first visible and enabled input field or textarea 
    $(":input:visible:enabled").each(function() { 
     if (($(this).attr('type') == 'text') && ($(this).is('input'))){ 
      $(this).focus(); 
      return false; 
     } 
     if ($(this).is('textarea')){ 
      $(this).focus(); 
      return false; 
     }  
    }); 
}); 
</script> 
0

Se si utilizza Raphael Verger soluzione, potrebbe essere anche una password, in modo da:

​$(function(){ 
    $('form[name=form2]').find(':text, textarea, :password').filter(":visible:enabled").first().focus(); 
})​ 
Problemi correlati