jQuery: come trovare la prima area di input / selezione / testo visibile escludendo i pulsanti?

87

Provai

$(":input:not(input[type=button],input[type=submit],button):visible:first")

ma non trova niente.

Qual è il mio errore?

UPD: lo eseguo su $ (document) .load ()

<script type="text/javascript">
$(window).load(function () {
  var aspForm  = $("form#aspnetForm");
  var firstInput = $(":input:not(input[type=button],input[type=submit],button):visible:first", aspForm);
  firstInput.focus();
});
</script>

e nel debug posso vedere che firstInput è vuoto.

UPD2: sono nella pagina ASP.NET in esecuzione su Sharepoint.

Finora ho scoperto che per alcuni elementi li trova (per quelli fissi) e per altri no. :(

jquery input jquery-selectors

— Artem
fonte

Prova "input" invece di ": input"?

— Alec

Dovrebbe funzionare bene. Il tuo problema è altrove. Non stai eseguendo questa prima l' $(document)è ready()?

— BalusC

Hai un HTML specifico da cercare?

— Shiki

Forse il primo input è di type="hidden"? Fare clic con il pulsante destro del mouse sulla pagina e visualizzare l'origine. Anche l'HTML generato è importante. Senza di esso e con un SSCCE adeguato , le riprese sono al buio.

— BalusC

166

Perché non scegliere come target solo quelli che desideri ( demo )?

$('form').find('input[type=text],textarea,select').filter(':visible:first');

modificare

Oppure usa jQuery : input selector per filtrare i discendenti del modulo.

$('form').find('*').filter(':input:visible:first');

— Mottie
fonte

5

Casella di controllo? Radio? Parola d'ordine? Per non parlare dei molti nuovi tipi di input HTML5.

— BalusC

9

@BalusC $ ('form'). Find (': input'). Filter (': visible: first')

— Abe Petrillo

1

Sebbene funzioni in una certa misura, ignora l'attributo tabindex.

— eoleary

2

Piccola nitpick ma utile aggiunta: invece di ': visible: first', ': visible: enabled: first' sarà un filtro molto migliore perché in alcuni casi l'elemento superiore potrebbe essere disabilitato e la messa a fuoco non può spostarsi lì.

— Prahlad Yeri

1

@PrahladYeri Forse escludi anche ':input:visible:enabled:not([readonly]):first'

— readonly

13

Il codice JQuery va bene. È necessario eseguire nel gestore pronto non nell'evento di caricamento della finestra.

<script type="text/javascript">
$(function(){
  var aspForm  = $("form#aspnetForm");
  var firstInput = $(":input:not(input[type=button],input[type=submit],button):visible:first", aspForm);
  firstInput.focus();
});
</script>

Aggiornare

Ho provato con l'esempio di Karim79 (grazie per l'esempio) e funziona bene: http://jsfiddle.net/2sMfU/

— PeterFromCologne
fonte

3

Grazie @BalusC. Adesso vado a spararmi. Mi odio. Avrei potuto passare l'ultima ora a non scherzare con il codice funzionante. Avrei potuto nutrire i miei cani, pulire la mia cucina. Ci sono molte cose che avrei potuto ottenere. Ora tutto quello che ho è dolore. Addio, per sempre .... E sì, ho dovuto dare ascolto.

— karim79

@karim: rofl. Prego :) A proposito: ho già fatto il bagno ai miei bambini, li ho portati a letto, ho dato da mangiare a cani e gatti e mi sono preso una coca cola;)

— BalusC

7

Questo è il mio riepilogo di quanto sopra e funziona perfettamente per me. Grazie per le informazioni!

<script language='javascript' type='text/javascript'>
    $(document).ready(function () {
        var firstInput = $('form').find('input[type=text],input[type=password],input[type=radio],input[type=checkbox],textarea,select').filter(':visible:first');
        if (firstInput != null) {
            firstInput.focus();
        }
    });
</script>

— Ben Foster
fonte

3

Questo è un miglioramento rispetto alla risposta di @ Mottie perché a partire da jQuery 1.5.2 :textseleziona gli inputelementi che non hanno un typeattributo specificato (nel qual caso type="text"è implicito):

$('form').find(':text,textarea,select').filter(':visible:first')

— Mike Slinn
fonte

1

Ecco la mia soluzione. Il codice dovrebbe essere abbastanza facile da seguire ma ecco l'idea:

ottenere tutti gli input, le selezioni e le aree di testo
filtrare tutti i pulsanti e i campi nascosti
filtrare solo i campi visibili e abilitati
seleziona il primo
focalizza il campo selezionato

Il codice:

function focusFirst(parent) {
    $(parent).find('input, textarea, select')
        .not('input[type=hidden],input[type=button],input[type=submit],input[type=reset],input[type=image],button')
        .filter(':enabled:visible:first')
        .focus();
}

Quindi chiama semplicemente focusFirst con il tuo elemento genitore o selettore.

Selettore:

focusFirst('form#aspnetForm');

Elemento:

var el = $('form#aspnetForm');
focusFirst(el);

— J Adam Rogers
fonte

0

Puoi provare sotto il codice ...

$(document).ready(function(){
    $('form').find('input[type=text],textarea,select').filter(':visible:first').focus();
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<form>
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
    
<input type="submit" />
</form>

Espandi lo snippet

— Mahbub
fonte