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

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

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

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

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

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

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)

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

Последние комментарии :
Марат :
02/09/2020 03:25
Рад, что помог! Приходите еще!
подробнее.
Алексей :
02/09/2020 01:16
Спасибо Кое-что пригодилось!
подробнее.
Павел :
26/08/2020 05:57
textarea В таблице, а таблица в родительском div, а этот див является частью аккордеона, сам textarea без displey: none, но…
подробнее.
Марат :
26/08/2020 04:22
Столько написали и ничего не понятно!У вас есть textarea со свойством "display: none;" - непонятно... зачем textarea скрытый и…
подробнее.
Павел :
26/08/2020 08:02
Здравствуйте. Пишу плагин для таблицы, в таблице много textarea, плагин и таблица расположены в скрытой вкладке…
подробнее.