Всех друзей поздравляем с Новым годом! Всего вам самого наилучшего! Всех благ, здоровья а материальное приложится!
СКРИПТЫ althtmlcssphpjsblog

Форма отправки сообщения с подсчетом количества символов.

Поддержи проект!!! smile

Мы уже делали форму отправки сообщения – это раз! И потом мы делали подсчет количества символов в форме – это два!

И три – давайте их скрестим!

Не будем разжевывать все до последней капли, только вкратце алгоритм, что добавили:

1.Нам потребуется поле, в котором будем считать количество символов:

<input class="Stroka" size="4" value="0" name="Stroka" type="text" title="Кол-во символов">

2.Модифицируем наш скрипт из выше идущей ссылки:

Покрасим выше идущий инпут(когда количесвто символов перейдет наш придел.):

document.My_form.Stroka.style.color = "red"; 

Добавим новый класс нашему полю(который будет бликать красным)

document.getElementById("mess").classList.add("blink"); 

И покрасим цвет текста в красный(чтобы красный переходил в ркасный а не так. - красный переходит в черный - получается некрасиво...)

document.getElementById("mess").setAttribute("style", "color: red"

<script>

var peremennaya = 10;

function Count_elements() { var How_much = window.document.My_form.mess.value.length;  window.document.My_form.Stroka.value = peremennaya - How_much;   

if(How_much > peremennaya){ 

document.My_form.Stroka.style.color = "red"; 

document.getElementById("mess").classList.add("blink"); 

document.getElementById("mess").setAttribute("style", "color: red" ); 

  }

}  

</script> 

И тот класс. что мы будем присваивать, как только количество символов перейдет наши пределы...

.blink {

  -webkit-animation: blink 2s linear infinite;

  animation: blink 2s linear infinite;

}

@-webkit-keyframes blink {

  50%  { color: rgb(255, 0, 0); }

  51%  { color: rgba(255, 0, 0, 0); }

  100% { color: red; }

}

@keyframes blink {

  50%  { color: rgb(255, 0, 0); }

  51%  { color: rgba(255, 0, 0, 0); }

  100% { color: red; }

}

И добавили проверку в php строка 124 и 130 количество символов в имени и в сообщении.

В примере количество символов ограничено 10 символами.


Вас может еще заинтересовать список тем : #PHP | #PHP_POST | #JS | #CAPTCHA | #COUNT_SYMBOL |
Последняя дата редактирования : 2020-02-12 11:16
Название скрипта :Форма и подсчет количества введенных знаков(JS)
Скрипт № 73.8Ссылка на скачивание : Все скрипты на одной странице
//dwweb.ru/comments_1_5/include/img/hand_no_foto.png
no
no
Еще никто не прокомментировал! COMMENTS+   BBcode
аватар
🞨
Загрузить свой аватар
(max ширина, высота = 200px)

Подписаться + =
Теги:
Форма отправки сообщения с подсчетом количества символов.

Последние комментарии :
Марат :
23/11/2020 07:38
Приходите ещё!
подробнее.
Лило :
23/11/2020 06:34
Благодарю, удобно
подробнее.
Марат :
15/11/2020 01:57
Здесь отвечал...1) Есть вот комментарии от вконтактае, очень простые 2)Такое же есть от мордокниги, 3) смотрите…
подробнее.
Денис :
15/11/2020 01:36
А можно ли как нибудь установить на свой сайт эти комментарии? Уже 6 месяцев…
подробнее.
Марат :
11/11/2020 10:48
Вчера, моему сайту помогли материально!Спасибо тебе!!! Безымянный Друг!!! Кто помог сайту! Что оценил мою…
подробнее.