ტექსტური სელექტორი
სელექტორი :text ირჩევს ტიპით
text ინფუთებს. იხილეთ თეგი
input.
რადგან :text არ ეკუთვნის CSS სპეციფიკაციას,
თანამედროვე ბრაუზერებში მუშაობის გასაუმჯობესებლად მის ნაცვლად უკეთესია გამოიყენოთ
[type='text'].
სინტაქსი
ასე ვირჩევთ ტიპით text ინფუთებს:
$(':text');
ისევე, როგორც სხვა სეუდო-კლასის სელექტორებთან
(რომლებიც იწყება ':'-ით), ':'-ის წინ უკეთესია
დაისახოს თეგის სახელი ან სხვა სელექტორი,
წინააღმდეგ შემთხვევაში გამოყენებული იქნება სელექტორი '*',
ანუ $(':text') აღიქმება როგორც
$('*:text'), ამიტომ ამის ნაცვლად უკეთესია
გამოიყენოთ $('input:text').
უნდა გვახსოვდეს, რომ :text ასევე ირჩევს
ყველა ინფუთს, რომელსაც არ აქვს მითითებული type ატრიბუტი,
ქცევაში განსხვავებები შეგიძლიათ ნახოთ შემდეგ
მაგალითზე:
$('<input>').is('[type=text]'); // დააბრუნებს false-ს
$('<input>').is(':text'); // დააბრუნებს true-ს
მაგალითი
მოდით, ავირჩიოთ ყველა ტიპით text ინფუთი და
გავაწყოთ მათ მწვანე ფონი და წითელი ჩარჩო მეთოდის
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(); // ხელს უშლის ფორმის გაგზავნას
});