javascript form оставшееся количество символов счетчика - требование модификации для строгой проверки xhtml

Я использовал этот код javascript на своей странице, а затем проверил с помощью валидатора w3c. Я получил 2 ошибки, которые:

  1. нет атрибута "onKeyDown"
  2. нет атрибута "onKeyUp"

Я не буду менять тип объявления html на переходный. Поэтому мне нужна модификация в сценарии.

Скрипт HTML

<textarea id="message" cols="20" rows="5" name="message" onKeyDown="textCounter('message','messagecount',100);" onKeyUp="textCounter('message','messagecount',100);"></textarea>
<span id="charsleft"></span>

Скрипт Javascript:

<script>
    function textCounter(textarea, countdown, maxlimit) {
        var textareaid = document.getElementById(textarea);
        if (textareaid.value.length > maxlimit)
          textareaid.value = textareaid.value.substring(0, maxlimit);
        else
          document.getElementById('charsleft').innerHTML = '('+(maxlimit-textareaid.value.length)+' characters available)';
      }
</script>

<script type="text/javascript">
    textCounter('message','messagecount',100);
</script>

Поскольку я ничего не знаю о javascript, я прошу вас: какие должны быть изменения, чтобы моя страница прошла строгую проверку XHTML 1? Или мне нужно искать другой сценарий, который прошел проверку XHTML 1.0 Strict и делает то же самое?

Примечание: Пока скрипт работает таким образом: когда вы пишете в textarea, появляется часть между двумя промежутками в <span id="charsleft"></span> и записывает количество оставшихся символов в реальном времени. Способ демонстрации стиля для меня не важен. Например, первое значение (ограничение количества символов) может быть всегда видно. Единственный момент — проверка W3C.

Спасибо, BR.


javascript html counter w3c-validation xhtml-1.0-strict
person Andre Chenier    schedule 22.03.2013    source источник
comment
Самое простое решение — использовать ненавязчивый JavaScript вместо встроенных обработчиков событий.   -  person David says reinstate Monica    schedule 22.03.2013

Ответы (1)


arrow_upward
1
arrow_downward

Валидатор w3c включает подсказку «Как исправить», когда выдает подобные ошибки.

В вашем случае написано:

Как исправить: проверьте написание и регистр элемента и атрибута, (Помните, что в XHTML все строчные)...

То есть измените имена атрибутов, чтобы все они были строчными:

<textarea id="message" cols="20" rows="5" name="message" onkeydown="textCounter('message','messagecount',100);" onkeyup="textCounter('message','messagecount',100);"></textarea>
<span id="charsleft"></span>

Было бы лучше удалить встроенные атрибуты событий и добавить обработчики событий из JS в ваш блок сценария, но мне лень, поэтому я объявляю это вне области действия. (Погуглите «ненавязчивый javascript», чтобы найти некоторые подсказки по этому поводу.)

person nnnnnn    schedule 22.03.2013