Отображение минимального количества символов, необходимых для поля ввода - PullRequest
Новая
       46

Отображение минимального количества символов, необходимых для поля ввода

0 голосов
/ 25 марта 2012

У меня есть этот код: 

<script type="text/javascript">
var maxLength=10;
function charLimit(el) {
    if (el.value.length > maxLength) return false;
    return true;
}

function characterCount(el) {
    var charCount = document.getElementById('charCount');
    if (el.value.length > maxLength) el.value = el.value.substring(0,maxLength);
    if (charCount) charCount.innerHTML = maxLength - el.value.length;
    return true;
}
</script>

вместе с этим полем ввода: 

<input type="text" onKeyPress="return charLimit(this)" onKeyUp="return characterCount(this)" />
<span id="charCount">10</span>

Как и сейчас, он ведет обратный отсчет набранных символов от 10 до 0 . Я хочу добавить к нему некоторый код, где при загрузке страницы будет отображаться 10 (введите минимум 3 символа) , а при вводе этих трех символов текст в () пропадет, и останется только номер, т.е. 7 .

Кроме того, если вы удалите введенный текст, если количество символов меньше 3, текст в () будет отображаться снова, т.е. что-то вроде этого: 8 (введите 3 символа минимум)

Или даже лучше, если это можно сделать так:

10 (0 символов введены из 3 минимальных)
9 (введено 1 символа из 3 минимальных)
8 (2 знака введены из 3 минимальных)
7

Это не должен быть текущий код, который у меня есть, предложите другой код, если он у вас есть.

1 Ответ

3 голосов
/ 25 марта 2012

Поскольку никто не написал ответ, я напишу один.(Даже если это не похоже на то, что вы сами попробовали.) 

function characterCount(el) {
    var charCount = document.getElementById('charCount');
    if (el.value.length > maxLength) el.value = el.value.substring(0,maxLength);
    if (charCount) charCount.innerHTML = maxLength - el.value.length;
    return true;
}

до 

function characterCount(el) {
    var charCount = document.getElementById('charCount');
    if (el.value.length > maxLength) el.value = el.value.substring(0,maxLength);
    if (charCount) {
        if(el.value.length < 3) {
            charCount.innerHTML = (maxLength - el.value.length) + ' (' + (3 - el.value.length) + ' out of 3 characters minimum)';
        } else {
            charCount.innerHTML = maxLength - el.value.length;
        }
    }
    return true;
}
...