Блог Vaden Pro

Все о самостоятельном создании и продвижении сайтов
Вы здесь

Событие onkeyup

Дата:8.09.15 в 11:33
Справочник: 

Характеристики атрибута

В каких браузерах работает?

4.0+ 1.0+ 3.5+ 1.0+ 1.0+ 1.0+ 1.0+

Для чего используется

Событие onkeyup по принципу своей активации похоже на onkeypress и onkeydown, только с тем отличием, что действие происходит после отпускания клавиши на клавиатуре.

В каких тегах он может использоваться?

a abbr acronym address
applet area b basefont
bdo bgsound big blockquote
body br button caption
center cite code col
colgroup dd del dfn
dir div dl dt
em embed fieldset font
form frame h1 - h6 hr
i iframe img input
ins isindex kbd label
legend li link map
marquee menu nobr object
ol option p plaintext
pre q s samp
select small span strike
strong sub sup table
tbody td textarea tfoot
th thead tr tt
u ul var wbr
xmp

Как правильно задавать?

Простейший пример использования атрибута выглядит следующим образом:

onkeyup="код скрипта"

Какие значения могут быть записаны в атрибут?/h4>

Скрипт.

Пример использования

<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="utf-8">
  <title>Событие onkeyup</title>
  <style>
   #messege { 
    color: #ff0000; /* Цвет сообщения */ 
    display: none; /* Скрываем от вывода */
   }
  </style>
  <script>
   function validForm(f) {
    // при правильном заполнении поля сообщение скрывается
    if (isDigit(f.value)) document.getElementById("messege").style.display = "none";
    // если в поле вписаны не цифры - выводим сообщение об ошибке
    else document.getElementById("messege").style.display = "inline";
   }
   // проверяем заполнение поля цифрами
   function isDigit(data) {
    var numStr="0123456789";
    var k = 0;
    for (i=0;i<data.length;i++) {
      thisChar = data.substring(i, i+1);
      if (numStr.indexOf(thisChar) != -1) k++;
    }
    if (k == data.length) return 1;
    else return 0;
   }
  </script>
 </head>
 <body>
  <form action="">
   <p>Ввести свое любимое число</p>
   <p><input type="text" name="num" onkeyup="validForm(this)"> 
      <span id="messege">Ошибка!</span></p>
  </form>
 </body>
</html>

Пример применения события onkeyup

Событие onkeyup
Пример показывает, как работает событие onkeyup. В качестве примера взята проверка заполнения поля формы. В поле вводятся только цифры, в противном случае выскакивает сообщение об ошибке.

Оценка: 
Оценок: 1 (средняя 5 из 5)
Тип HTML атрибута: 
Понравилась статья? Расскажите о ней друзьям: