text-selektor
Selektoren :text velger inndatafelt med
typen text. Se taggen
input.
Siden :text ikke tilhører CSS-spesifikasjonen,
er det for bedre ytelse i moderne
nettlesere bedre å bruke
[type='text'] i stedet.
Syntaks
Slik velger vi inndatafelt med typen text:
$(':text');
Som med andre pseudoklasse-selektorer
(som starter med ':'), er det bedre å
sette taggnavnet eller en annen selektor foran ':', i
motsatt fall vil selektoren '*' bli brukt,
det vil si at $(':text') vil bli oppfattet som
$('*:text'), så i stedet for dette er det bedre å
bruke $('input:text').
Man må huske at :text også vil velge
alle inndatafelt der attributtet type ikke er spesifisert,
forskjellen i oppførsel kan sees i følgende
eksempel:
$('<input>').is('[type=text]'); // returnerer false
$('<input>').is(':text'); // returnerer true
Eksempel
La oss velge alle inndatafelt med typen text og
gi dem en grønn bakgrunn og en rød ramme ved hjelp av metoden
css:
<form>
<input type="button" value="button">
<input type="file">
<input type="checkbox">
<button>button</button>
<input type="reset">
<input type="radio" name="test">
<input type="radio" name="test">
<input type="checkbox">
<input type="text">
</form>
$('form input:text').css({background: 'green', border: '2px red solid'});
$('form').submit(function(event) {
event.preventDefault(); // forhindrer innsending av skjemaet
});