Селектори text

Селектори :text вурудӣҳоро бо навъи text интихоб мекунад. Теги input-ро бубинед. Азбаски :text ба тавсифи CSS тааллуқ надорад, пас барои беҳтар намудани суръати кор дар браузерҳои муосир ба ҷои он истифода бурдани [type='text'] беҳтар аст.

Синтаксис

Ҳамчунин мо вурудӣҳоро бо навъи text интихоб мекунем:

javascript$(':text');

Ҳамчунон ки бо дигар селекторҳои псевдокласс (бо ':' оғозшаванда), пеш аз ':' беҳтар аст номи тег ё селектори дигарро гузоштан, дар акси ҳол селектори '*' истифода мешавад, яъне $(':text') чун $('*:text') дарк карда мешавад, аз ин рӯ ба ҷои ин беҳтар аст $('input:text') истифода бурдан. Бояд ба ёд овард, ки :text низ ҳамаи вурудӣҳоро интихоб мекунад, ки сифати type-и онҳо мушаххас нашудааст, фарқиятҳои рафторро дар мисоли зерин бубинед:

javascript$('<input>').is('[type=text]'); // дурӯст бармегардад
$('<input>').is(':text'); // рост бармегардад

Мисол

Биёед, ҳамаи вурудӣҳоро бо навъи text интихоб кунем ва заминашонро сабз ва қафаси сурхро бо усули css созем:

html<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>
javascript$('form input:text').css({background: 'green', border: '2px red solid'});

$('form').submit(function(event) {
  event.preventDefault(); // аз фиристодани форм пешгирӣ мекунад
});

Инчунин бубинед

  • теги input
  • селектори input,
    ки элементҳои идоракунии формро интихоб мекунад - вурудӣҳо, текстареа, рӯйхатҳои дареҳӣ ва тугмаҳо
  • усули filter,
    ки элементҳоро дар маҷмӯъ бо селектори додашуда филтр мекунад