Обзор интернета - Lite Веб-мастеру Графика Игры, Спорт Программы Рецепты Время Рождество Библия
Свой сайт Хостинг Облака Домены Ресурсы Формы на сайт Раскрутка
API JavaScript База данных

JavaScript / Работа с текстом / Процент заполненности формы

Показывает процент заполненности формы.

<STYLE type=text/css>.progress {PADDING-LEFT: 5px; FONT-SIZE: 12px; OVERFLOW: hidden; WIDTH: 1px; COLOR: white; HEIGHT: 14px; BACKGROUND-COLOR: navy}</STYLE>
 
 
<script>
 //Copytext to clipboard- by Gennero (patrice.gennero@voila.fr)
 //Visit http://www.dynamicdrive.com for this script
 
 
bBool=false
 var copiedtext=""
 var tempstore=""
 
 
function initiatecopy() {
 bBool=true;
 }
 
 
function copyit() {
 if (bBool) {
 tempstore=copiedtext
 document.execCommand("Copy")
 copiedtext=window.clipboardData.getData("Text");
 bBool=false;
 }
 }
 
 
document.onselectionchange = initiatecopy
 document.onmouseup = copyit
 
 
</script>
 
 
<SCRIPT type=text/JavaScript>
 /* Form Field Progress Bar- By Ron Jonk- http://www.euronet.nl/~jonkr/
 * Script featured/ available at Dynamic Drive- http://www.dynamicdrive.com*/
 
 
function textCounter(field,counter,maxlimit,linecounter) {
  // text width//
  var fieldWidth =  parseInt(field.offsetWidth);
  var charcnt = field.value.length;        
 
 
 // trim the extra text
  if (charcnt > maxlimit) { 
   field.value = field.value.substring(0, maxlimit);
  }
 
 
 else { 
  // progress bar percentage
  var percentage = parseInt(100 - (( maxlimit - charcnt) * 100)/maxlimit);
  document.getElementById(counter).style.width =  parseInt((fieldWidth*percentage)/100)+"px";
  document.getElementById(counter).innerHTML="Limit: "+percentage+"%"
  // color correction on style from CCFFF -> CC0000
  setcolor(document.getElementById(counter),percentage,"background-color");
  }
 }
 
 
function setcolor(obj,percentage,prop){
  obj.style[prop] = "rgb(80%,"+(100-percentage)+"%,"+(100-percentage)+"%)";
 }
 </SCRIPT>
  Количество разрешенных символов:80
 <form name=form><TEXTAREA id=maxcharfield onkeydown="textCounter(this,'progressbar1',80)" onkeyup="textCounter(this,'progressbar1',80)" onfocus="textCounter(this,'progressbar1',80)" name=maxcharfield rows=3 cols=38></TEXTAREA><br>
 <DIV class=progress id=progressbar1></DIV>
 <SCRIPT>textCounter(document.getElementById("maxcharfield"),"progressbar1",20)</SCRIPT>
 </FORM>                  

Пример

Количество разрешенных символов:80

JavaScript Самоучитель по JavaScript Список зарезервированных слов для JavaScript
Скачать скрипты
CheckboxRadioSelectБегущая строкаВремяКартинкиМенюМышьОкнаПарольПечатьРабота с текстомСсылкиТаблицаТекстТестыФормулыФормыШифровкаЭффекты