Подсчет количества введенных символов в поле

12-25-2006, 04:56 PM

Приветствую Вас!
Никто не решал данную проблему?

Попытался использовать данный код:

HTML Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HEAD><TITLE></TITLE>
<META http-equiv=Content-Language content=ru>
<META http-equiv=Content-Type content="text/html; charset=windows-1251">

<SCRIPT language=javascript type=text/javascript>
<!--
var lang_max_car = "В вашем сообщении много знаков";
var lang_reste   = "Вы можете напечатать до";
var max_car      = 800;



function countCar(texta, mde) {
 if (texta.value.length>max_car)
  texta.value = texta.value.substring(0, max_car);

 if (mde==0)
  var leng = texta.value.length+1;
 else
  var leng = texta.value.length;

 var diff = ((max_car-leng) == "-1") ? "0" : max_car-leng;
 document.getElementById('reste_car').value = diff;
}
//-->
</SCRIPT>

      <STYLE type=text/css>
BODY {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; SCROLLBAR-FACE-COLOR: #666699; FONT-SIZE: 0.7em; PADDING-BOTTOM: 0px; MARGIN: 0px; SCROLLBAR-HIGHLIGHT-COLOR: #7e7c9c; SCROLLBAR-SHADOW-COLOR: #000000; COLOR: #000000; SCROLLBAR-ARROW-COLOR: #9999ff; PADDING-TOP: 0px; SCROLLBAR-TRACK-COLOR: #aaacc1; FONT-FAMILY: Verdana, Arial, Helvetica; SCROLLBAR-DARKSHADOW-COLOR: #000000; BACKGROUND-COLOR: #ffffff; TEXT-ALIGN: center; scrollbar-dlight-color: #000000
}
TD {
	FONT-SIZE: 11px; COLOR: #000000; FONT-FAMILY: Verdana
}
TEXTAREA {
	BORDER-RIGHT: #757575 1px solid; BORDER-TOP: #757575 1px solid; FONT-SIZE: 1em; BORDER-LEFT: #757575 1px solid; BORDER-BOTTOM: #757575 1px solid; FONT-FAMILY: Verdana, Helvetica, sans-serif
}
INPUT.i_text {
	BORDER-RIGHT: #757575 1px solid; BORDER-TOP: #757575 1px solid; FONT-SIZE: 1em; BORDER-LEFT: #757575 1px solid; WIDTH: 200px; BORDER-BOTTOM: #757575 1px solid; FONT-FAMILY: Verdana, Helvetica, sans-serif
}
INPUT.i_focus {
	BORDER-RIGHT: #007e00 1px solid; BORDER-TOP: #007e00 1px solid; PADDING-LEFT: 2px; BORDER-LEFT: #007e00 3px solid; WIDTH: 200px; BORDER-BOTTOM: #007e00 1px solid; BACKGROUND-COLOR: #ebffeb
}
INPUT.btn_add {
	FONT-WEIGHT: bold; FONT-SIZE: 1em; CURSOR: pointer; COLOR: #373737
}
INPUT.btn_search {
	FONT-WEIGHT: bold; CURSOR: pointer; COLOR: #373737
}
INPUT.i_nbre_car {
	BORDER-RIGHT: 0px; BORDER-TOP: 0px; FONT-WEIGHT: bold; FONT-SIZE: 1em; BORDER-LEFT: 0px; COLOR: #cc3300; BORDER-BOTTOM: 0px; BACKGROUND-COLOR: transparent
}
INPUT.i_nbre_car_focus {
	BORDER-RIGHT: 0px; BORDER-TOP: 0px; FONT-WEIGHT: bold; FONT-SIZE: 1em; BORDER-LEFT: 0px; COLOR: #cc3300; BORDER-BOTTOM: 0px; BACKGROUND-COLOR: #ebffeb
}
TEXTAREA.i_comment_focus {
	BORDER-RIGHT: #007e00 1px solid; BORDER-TOP: #007e00 1px solid; PADDING-LEFT: 2px; BORDER-LEFT: #007e00 3px solid; WIDTH: 430px; BORDER-BOTTOM: #007e00 1px solid; BACKGROUND-COLOR: #ebffeb
}
.d_center {
	TEXT-ALIGN: center
}
.d_nbre_car {
	MARGIN: -18px 0px 0px 16px; TEXT-ALIGN: left
}
</STYLE>

</HEAD>
<BODY>



 <TABLE cellSpacing=10 cellPadding=0 width=480 align=center border=0>
        <TBODY>
        <TR>
          <TD width="10%">
<TEXTAREA class=i_comment id=vB_Editor_001_textarea onkeydown="countCar(this, 0)" onblur="this.className='i_comment'; document.getElementById('reste_car').className='i_nbre_car'; countCar(this, 1); document.getElementById('reste_car').value=''" onfocus="this.className='i_comment_focus'; document.getElementById('reste_car').className='i_nbre_car_focus'; countCar(this, 1)"  rows=8 cols=69></TEXTAREA> 
 <DIV class=d_nbre_car><INPUT class=i_nbre_car id=reste_car readOnly size=3></DIV></DIV>
</TD></TR></TBODY></TABLE></BODY></HTML>

Отдельно все работает... а на форуме нет... особенно в поле с WYSIWYG режимом...

Может кто подскажет как его победить?

Или уже есть готовое решение?

12-25-2006, 10:17 PM

а моет все таки проверять уже на сервере, после отправки данных? все гемора меньше.

12-27-2006, 12:21 AM

Согласен...
Это не настолько уж необходимая фича...

Просто иногда довольно удобна... для пользователя.

Например, если человек пишет довольно большой текст, то очень тяжело определить - сколько же знаков он ввел...

А так - пожалуйста - все как на ладони... Удобно...

03-15-2009, 11:35 PM

тоже возникла вдруг такая мысль... интересно, за 2 года ничего так и не изменилось?

03-16-2009, 12:14 AM

что то подобное делал в одном из своих хаков

скриптов в инете куча, выбирай любой
я нашел наиболее оптимальный, немного подправил функцию и встроил в хак

Code:

var bName = navigator.appName;
function taCount(taObj,Cnt,maxL) 
{ 
	objCnt = fetch_object(Cnt);
	objVal = taObj.value;
    if(objCnt) 
    {
		if(bName == "Netscape")
        {	
			  if(objVal.length > maxL)
			  {
                    objCnt.style.color = '#FF0000';
                    objCnt.textContent = maxL - objVal.length;
			  }else{
			        objCnt.style.color = '#000000';
                    objCnt.textContent = maxL - objVal.length;
			  }
        }else{
              if(objVal.length > maxL)
              {
                    objCnt.style.color = '#FF0000';
                    objCnt.innerHTML = maxL - objVal.length;
              }else{
                    objCnt.style.color = '#000000';
                    objCnt.innerHTML = maxL - objVal.length;
              }
        }
	}
	return true;
}

аргументы функции:
taObj,Cnt,maxL

taObj - объект
Cnt - MyID
maxL - $vboptions[your_textarea_strlen] (кол-во символов по дефолту)

в выбраном месте шаблона прописываем либо DIV либо SPAN с идентификатором MyID (свой, на выбор)

Code:

<div id="MyID">$vboptions[your_textarea_strlen]</div>

и потом в текстареа вызываем эту функцию по событию onkeyup="myfunc(arg1,arg2,arg3);"

Code:

<textarea onkeyup="return taCount(this,'MyID',$vboptions[your_textarea_strlen]);" id="id" name="name" rows="10" cols="80" style="width:100%; height:100px;"></textarea>

сразу хочу предупредить, код считает так же и переносы строк за 2 символа (\n\r), поэтому кому надо пишем доп. регексп, чтобы не считал их