jQuery: ilk görünür girdi / seçme / metin alanı hariç düğmeler nasıl bulunur?

88

denedim

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

ama hiçbir şey bulamıyor.

Benim hatam ne

UPD: Bunu $ (document) .load () üzerinde yürütüyorum

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

ve hata ayıklamada firstInput'un boş olduğunu görebiliyorum.

UPD2: Sharepoint altında çalışan ASP.NET sayfasındayım.

Şimdiye kadar buldum ki, bazı öğeler için onları buluyor (sabit olanlar için) ve bazıları için bulamıyor. :(

jquery input jquery-selectors

— Artem
kaynak

": İnput" yerine "input" mu deneyin?

— Alec

İyi çalışmalı. Senin sorunun başka bir yerde yatıyor. Bu yürütme değil misin önce$(document) olduğu ready()?

— BalusC

Aramak için belirli bir html'niz var mı?

— Shiki

Belki ilk girdi type="hidden"? Sayfayı sağ tıklayın ve kaynağı görüntüleyin. Oluşturulan HTML de önemlidir. O ve uygun bir SSCCE olmadan , karanlıkta çekim yapıyor.

— BalusC

168

Neden sadece istediklerinizi hedeflemiyorsunuz ( demo )?

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

Düzenle

Veya form alt bileşenlerini filtrelemek için jQuery : giriş seçiciyi kullanın.

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

— Mottie
kaynak

5

Onay kutusu mu? Radyo? Parola? Yeni HTML5 giriş türlerinden bahsetmiyorum bile.

— BalusC

9

@BalusC $ ( 'formu') bulmak ( ': giriş') filtre ( ': görünür: İlk')..

— Abe Petrillo

1

Bu bir dereceye kadar işe yarasa da, tabindex özelliğini görmezden geliyor.

— eoleary

2

Küçük nitpick ama kullanışlı bir ekleme: ': visible: first' yerine, ': visible: enabled: first' çok daha iyi bir filtre olacaktır çünkü bazı durumlarda üst öğe devre dışı bırakılabilir ve odak oraya kayamaz.

— Prahlad Yeri

1

@PrahladYeri Belki de salt okunur olarak hariç tutabilir':input:visible:enabled:not([readonly]):first'

— JustinStolle

13

JQuery kodu gayet iyi. Pencere yükleme olayında değil, hazır işleyicide yürütmelisiniz.

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

Güncelleme

Karim79 örneğiyle denedim (örnek için teşekkürler) ve iyi çalışıyor: http://jsfiddle.net/2sMfU/

— PeterFromCologne
kaynak

3

Teşekkürler @BalusC. Şimdi kendimi vuracağım. Kendimden nefret ediyorum. Son bir saati çalışma koduyla uğraşmadan geçirebilirdim. Köpeklerimi besleyebilir, mutfağımı temizleyebilirdim. Başarabileceğim birçok şey var. Şimdi sahip olduğum tek şey acı. Elveda sonsuza .... Ve evet, gereken dinledim.

— karim79

@karim: rofl. Rica ederim :) Btw: Çocuklarımı çoktan yıkadım, onları yatağa getirdim, köpekleri ve kedileri

— besledim

7

Bu, yukarıdakilerin özetidir ve benim için mükemmel bir şekilde çalışıyor. Bilgi için teşekkürler!

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

3

Bu, @ Mottie'nin cevabına göre bir gelişmedir çünkü jQuery 1.5.2'den itibaren belirli bir özniteliğe sahip olmayan öğeler :textseçer (bu durumda ima edilir):inputtypetype="text"

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

— Mike Slinn
kaynak

1

İşte benim çözümüm. Kod takip etmek için yeterince kolay olmalı ama işte fikir:

tüm girdileri, seçimleri ve metin alanlarını alın
tüm düğmeleri ve gizli alanları filtreleyin
sadece etkin, görünür alanlara filtre uygula
ilkini seç
seçilen alana odaklan

Kod:

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();
}

Ardından, ana öğeniz veya seçicinizle focusFirst öğesini çağırın.

Seçici:

focusFirst('form#aspnetForm');

Eleman:

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

— J Adam Rogers
kaynak

0

Aşağıdaki kodu deneyebilirsiniz ...

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

Snippet'i genişlet

— Mahbub
kaynak