jQuery: como encontrar os primeiros botões visíveis de entrada / seleção / textarea excluindo?

86

eu tentei

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

mas não encontra nada.

Qual é o meu erro?

UPD: eu executo isso em $ (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 na depuração, posso ver que firstInput está vazio.

UPD2: estou na página ASP.NET em execução no Sharepoint.

Descobri até agora que para alguns elementos ele os encontra (para os fixos) e para outros não. :(

jquery input jquery-selectors

— Artem
fonte

Tente "input" em vez de ": input"?

— Alec

Deve funcionar bem. Seu problema está em outro lugar. Você não está executando este antes de o $(document)é ready()?

— BalusC de

Você tem um html específico para pesquisar?

— Shiki

Talvez a primeira entrada seja de type="hidden"? Clique com o botão direito na página e visualize o código-fonte. O HTML gerado também é importante. Sem ele e um SSCCE adequado , está atirando no escuro.

— BalusC de

165

Por que não segmentar apenas aqueles que você deseja ( demonstração )?

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

Editar

Ou use jQuery : seletor de entrada para filtrar os descendentes do formulário.

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

— Mottie
fonte

5

Caixa de seleção? Rádio? Senha? Sem mencionar a grande quantidade de novos tipos de entrada HTML5.

— BalusC

9

@BalusC $ ('formulário'). Find (': entrada'). Filter (': visível: primeiro')

— Abe Petrillo

1

Embora isso funcione até certo ponto, ele ignora o atributo tabindex.

— ano

2

Pequeno detalhe, mas adição útil: em vez de ': visible: first', ': visible: enabled: first' será um filtro muito melhor porque o elemento superior pode ser desabilitado em alguns casos e o foco não pode mudar lá.

— Prahlad Yeri

1

@PrahladYeri Talvez também exclua somente leitura':input:visible:enabled:not([readonly]):first'

— JustinStolle

13

O código JQuery está bem. Você deve executar no manipulador de prontidão, não no evento de carregamento da janela.

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

Atualizar

Tentei com o exemplo do Karim79 (obrigado pelo exemplo) e funciona bem: http://jsfiddle.net/2sMfU/

— PeterFromCologne
fonte

3

Obrigado @BalusC. Eu vou atirar em mim agora. Eu me odeio. Eu poderia ter passado a última hora sem mexer no código em funcionamento. Eu poderia ter alimentado meus cachorros, limpo minha cozinha. Há muitas coisas que eu poderia ter alcançado. Agora tudo que tenho é dor. Adeus, para sempre ... E sim, eu deveria ter escutado.

— karim79

@karim: rofl. De nada :) A propósito: Eu já dei banho em meus filhos, trouxe-os para a cama, alimentei cachorros e gatos e tomei uma coca-cola para mim;)

— BalusC

7

Este é o meu resumo do que precede e funciona perfeitamente para mim. Obrigado pela informação!

<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

Esta é uma melhoria em relação à resposta de @Mottie porque a partir do jQuery 1.5.2 :textseleciona inputelementos que não têm nenhum typeatributo especificado (neste caso type="text"está implícito):

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

— Mike Slinn
fonte

1

Aqui está minha solução. O código deve ser fácil de seguir, mas aqui está a ideia:

obter todas as entradas, seleções e áreas de texto
filtrar todos os botões e campos ocultos
filtrar apenas para campos visíveis e habilitados
selecione o primeiro
focar o campo selecionado

O código:

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

Em seguida, basta chamar focusFirst com seu elemento pai ou seletor.

Seletor:

focusFirst('form#aspnetForm');

Elemento:

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

— J Adam Rogers
fonte

0

Você pode tentar o código abaixo ...

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

Expandir trecho

— Mahbub
fonte