Количество символов с несколькими ограничениями - PullRequest
0 голосов
/ 12 января 2011

Я новичок в javascript и пытаюсь написать скрипт, который определяет количество символов в боксе, а затем сравнивает длину счета с массивом ограничений символов. Если счетчик boxarea превышает заданный предел, у элемента массива переключается другой класс.

Если я путаюсь, может быть, этот (очень плохой) скрипт поможет:

$(document).ready(function(){   
    limit1.count = 10;
    limit2.count = 15;
    limit3.count = 20;


    function getCount (textarea) {
        var i=0;
        for (i=0;i<=5;i++)
        {
        if(textarea.value.length > limit[i].count) {
            $(limit[i].toggleClass("unavailable");
        }
        }
        }
}); 

1 Ответ

1 голос
/ 12 января 2011

Это должен быть ваш стиль:

<style type="text/css">
.box {width: 100px; height: 100px; display: block; margin: 10px; float: left;
    background-color: green;}
.unavailable {background-color: red;}
</style>

HTML:

<div><textarea name="textarea" id="textarea" cols="45" rows="5"></textarea></div>

<div id="box1" class="box">Box 1</div>
<div id="box2" class="box">Box 2</div>
<div id="box3" class="box">Box 3</div>

И JavaScript:

<script type='text/javascript' src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" ></script>
<script type='text/javascript'>  
    function validate()
    {
        var validation = { 
            '#box1': 10, 
            '#box2': 15,
            '#box3': 20
        }; 

        $.each(validation, function(elem, max) { 
            $(elem).removeClass("unavailable");
            if($('#textarea').val().length > max)
                $(elem).addClass("unavailable");
        });
    }

    $(document).ready(function(){   
        $('#textarea').keydown(validate);
        validate();
    });
</script>
...