Introdução ao jQuery
3.5 Selecionando elementos pelo status
Seleciona todos os inputs que possuem como irmão um button:
$("button ~ input")
O resultado será:
<input type="text" id="email"/>
É importante observar que esse seletor seleciona apenas os elementos que são irmãos de button, mas somente a partir dele, não considerando os elementos que antecedem ao button. Ambos devem possuir o mesmo ancestral direto (form) em comum.
3.5 Selecionando elementos pelo status São seletores do jQuery que permitem selecionar determinados elementos de acordo com seu estado, tais como: marcado, selecionado, desabilitado e com o foco do usuário. Considere o código a seguir para demonstração do uso de cada tipo de seletor:
<div id="site">
<button>voltar</button>
<form>
<span>Salvar login? </span>
<input type="checkbox" checked>
Número protocolo:
<input type="text" id="proto" value="910021"
disabled="disable">
<input type="hidden" id="user_id" value="1949"/>
País destino:
<select>
<option>Brasil</option>
<option selected>Paraguai</option>
<option>Argentina</option>
</select>
<label for="nome">Nome:</label>
<input type="text" id="nome"/>
<label for="cpf">CPF:</label>
<input type="text" id="cpf"/>
</form>
</div>
20 Seleciona elemento marcado
Este seletor permite localizar apenas os elementos que foram ou estão marcados. No exemplo, temos um seletor que seleciona apenas as inputs marcadas:
$("input:checked")
O retorno do seletor será:
<input type="checkbox" checked>
21 Seleciona elemento que está selecionado
Por exemplo, se quisermos encontrar a opção de um select que foi selecionada pelo usuário, poderíamos definir o seguinte seletor:
$("option:selected")
O retorno do seletor será o elemento:
<option selected>Paraguai</option>
22 Seleciona elemento que possui o foco
No exemplo, procuramos apenas a input que possui o foco do usuário, isto é, aquela que tem o cursor de tela no momento atual:
$("input:focus")
23 Seleciona elemento que está desabilitado
No exemplo, selecionamos apenas as inputs que estão desabilitadas:
$("input:disabled")
O retorno do seletor será o elemento:
<input type="text" id="proto" value="910021" disabled="disable">
24 Seleciona elementos visíveis
Este seletor permite selecionar apenas as tags visíveis. No exemplo, definimos que apenas as inputs visíveis devem ser selecionadas:
$("input:visible")
O retorno do seletor será:
<input type="checkbox" checked>
<input type="text" id="proto" value="910021" disabled="disable">
<input type="text" id="nome"/>