Jump to content
  • 0

Как подсчитать колличество сим. в textarea?


grantand
 Share

Question

Здравствуйте!

Есть такая задача, нужно создать поле для ввода текста и ограничить его к примеру 100 символами. Нужно чтобы когда пользователь вводил данные в поле, то он сразу же мог видеть сколько символов ему остается. Подскажите как и с помощью чего можно такое сделать?

пример: http://kyivstar.net/sms/

Link to comment
Share on other sites

14 answers to this question

Recommended Posts

  • 0

Это в Javascript наверное нужно было создавать тему. Javascript-ом можно такое сделать, я правда пока не знаю как, но то что можно это точно.

А вот PHP вероятно не будет обрабатывать данные при каждом вводе символа. PHP может выдать только статическую информацию например количество допустимых символов, но не более.

Тебя же не устроит что при каждом вводе очередного символа, страница будет перезагружаться, поэтому это на Javasript нужно писать.

Link to comment
Share on other sites

  • 0

вот что недавно пришлось сочинить :cool:

var listenElements = new Array();

function refreshCounters() {
for (i = 0; i < listenElements.length; i++) {
span = document.getElementById("counter_" + listenElements[i].getAttribute("id"));
if (typeof span != null) {
span.childNodes[0].nodeValue = listenElements[i].value.length;
}
}
window.setTimeout(refreshCounters, 100);
}

function attachCharCounter(element) {
var elparent = element.parentNode;

if (typeof elparent != null) {
span = document.createElement("span");
span.setAttribute("id", "counter_" + element.getAttribute("id"));
elparent.insertBefore(span, element.nextSibling);
span.appendChild(document.createTextNode(element.value.length));
listenElements.push(element);
}
}

function addCharCounters() {
var textareas = document.getElementsByTagName("textarea");
for (i = 0; i < textareas.length; i++) {
attachCharCounter(textareas[i]);
}

var inputs = document.getElementsByTagName("input");
for (i = 0; i < inputs.length; i++) {
if (inputs[i].getAttribute("type") == "text") {
attachCharCounter(inputs[i]);
}
}

refreshCounters();
}

if (window.attachEvent) {
window.attachEvent("onload", addCharCounters);
} else if (window.addEventListener) {
window.addEventListener("load", addCharCounters, false);
}

Link to comment
Share on other sites

  • 0
Но выкладывать лентяям ничего не хочется))) Tokolist - одумайтесь :)

Дык это самое... Я вот тут подумал...

Нада бы с главной страницы сайта убрать всю инфу про HTML, CSS и вообще все что может оказаться полезным для посетителя. Только не нужно думать что СКРИПТ - это дорого, а HTML - это дешево...

Че все злые какие... Вот так и загибаются потихоньку хорошие Web проекты. Сначала вроде-бы все для посетителя, милости просим и.т.д... А потом раз... И АБАРЗЕЛИ (не постесняюсь этого слова).

Что? Так сильно поднаторели что с новичками вообще не в почете пообщаться...

А если сами когда нибудь будете нуждаться в ответе на вопрос?

PS Не правильная политика.

Tokolist - Спасибо тебе огромное... Поделился и поделился скриптом, я бы тоже поделился... Меня вот пока этот вопрос не интересовал, но на будущее мне было тоже интересно узнать решение. А если так вот каждый будет по углам свои хитрости или знания шкерить... ну в принципе можно конечно и так... Бизнес есть бизнес!!! Нужен скрипт - плати бабки!!! Только вот одно дело когда вас просят написать сайт (полноценный и функциональный) и совсем другое дело когда вас просто спрашивают как можно сделать вот так?

Link to comment
Share on other sites

  • 0

А я вот что у себя в заначках нашел.

<html>
<head>
<script type="text/javascript">

/*
Form field Limiter script- By Dynamic Drive
For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
This credit MUST stay intact for use
*/

var ns6=document.getElementById&&!document.all

function restrictinput(maxlength,e,placeholder){
if (window.event&&event.srcElement.value.length>=maxlength)
return false
else if (e.target&&e.target==eval(placeholder)&&e.target.value.length>=maxlength){
var pressedkey=/[a-zA-Z0-9.,/]/ //detect alphanumeric keys
if (pressedkey.test(String.fromCharCode(e.which)))
e.stopPropagation()
}
}

function countlimit(maxlength,e,placeholder){
var theform=eval(placeholder)
var lengthleft=maxlength-theform.value.length
var placeholderobj=document.all? document.all[placeholder] : document.getElementById(placeholder)
if (window.event||e.target&&e.target==eval(placeholder)){
if (lengthleft<0)
theform.value=theform.value.substring(0,maxlength)
placeholderobj.innerHTML=lengthleft
}
}


function displaylimit(thename, theid, thelimit){
var theform=theid!=""? document.getElementById(theid) : thename
var limit_text='<b><span id="'+theform.toString()+'">'+thelimit+'</span></b> characters remaining on your input limit'
if (document.all||ns6)
document.write(limit_text)
if (document.all){
eval(theform).onkeypress=function(){ return restrictinput(thelimit,event,theform)}
eval(theform).onkeyup=function(){ countlimit(thelimit,event,theform)}
}
else if (ns6){
document.body.addEventListener('keypress', function(event) { restrictinput(thelimit,event,theform) }, true);
document.body.addEventListener('keyup', function(event) { countlimit(thelimit,event,theform) }, true);
}
}
</script>
</head>
<body>
<form name="sampleform">
<input type="text" name="george" size=20>

<script>
displaylimit("document.sampleform.george","",5)
</script>
<p>
<textarea name="john" id="johndoe" cols=25 rows=15></textarea>

<script>
displaylimit("","johndoe",10)
</script>
</form>
</body>
</html>

Link to comment
Share on other sites

  • 0
А если сами когда нибудь будете нуждаться в ответе на вопрос?

2Vladiger, есть разница между "ответ на вопрос" и "сделайте мне". Я никогда не прихожу на форум с просьбой сделать мне что-то с нуля, оттого, что мне было лень что-то попытаться делать самому.

Если бы автор сам покопался, что-то написал и спросил что в его коде не так, тогда конечно можно помочь (а вы видите, чтобы автор прив?л хотя бы отрывок своего кода?).

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

Link to comment
Share on other sites

  • 0
Решение на самом деле занимает всего около 10-13 строчек.

Но выкладывать лентяям ничего не хочется))) Tokolist - одумайтесь :)

Хорошо что ты такой у нас умный и все знаешь еще с материнской утробы.

Я не просил сделать за меня что-то, я лишь просил помощи и подсказки. Но есть на свете и добрые люди, как Tokolist который не зазнался что он мегаофигенный кодер и все же помог уже готовым кодом, за что ему БОЛЬШОЕ спасибо.

Link to comment
Share on other sites

  • 0

2grantand, суть в том, что получив готовый код, сами вы ничему не научились, а тупо вс? скопировали.

Если возникнет новая задача (пускай даже такая же, но с некоторыми модификациями), вы первым делом побежите туда, где вам дали готовый скрипт, вместо того, чтобы самому попробовать разобраться.

Link to comment
Share on other sites

  • 0
2grantand, суть в том, что получив готовый код, сами вы ничему не научились, а тупо вс? скопировали.

Если возникнет новая задача (пускай даже такая же, но с некоторыми модификациями), вы первым делом побежите туда, где вам дали готовый скрипт, вместо того, чтобы самому попробовать разобраться.

Я не тупо все скопировал, я пытаюсь в этом во всем разобраться. Я сейчас в процессе. Задача была построена мной для меня самого же. Тоесть сейчас и изучаю для себя пхп и по возможности явускрипт. Мне не нужно готовые коды абы просто сделать, мне вот именно надо знать и понимать что к чему. В данном случае это просто замечательно найти уже готовое решение и в нем разобраться.

Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy