Попытка очистить бумагу Рафаэля, когда ввод пуст - PullRequest
Новая
       17

Попытка очистить бумагу Рафаэля, когда ввод пуст

1 голос
/ 28 февраля 2012

У меня наконец-то появилась эта штука, работающая так, как я хочу. Это своего рода индикатор выполнения, который увеличивается в зависимости от ввода данных пользователем в форму. Единственная проблема заключается в том, что я хочу, чтобы документ очистился. Я предполагаю paper.clear();, когда поле ввода пустое. Однако в настоящее время он оставляет одну строку состояния (бутылку) на бумаге. Вот ссылка js fiddle http://jsfiddle.net/anderskitson/LmYm8/

ОБНОВЛЕНИЕ: я скопировал неправильный код, я изменил его сейчас. Ugg

и код 

    var paper = Raphael(document.getElementById("notepad"), 500, 500);

function drawBottles(count) {
    for (i = 0; i < count; i++) {

       var randomNumber3 = Math.floor(Math.random()*25);
       var path_a = paper.path("M242.07,270.119c0,0-14.596-30.606-7.625-35.793 c3.864-2.876,2.145-18.561,1.832-18.784c-0.313-0.224-1.839-0.319-1.839-0.319c-1.555-0.192-0.201-3.456-0.201-3.456 s0,0-0.598-0.352c-0.598-0.351,1.129-1.345,1.129-1.345c3.738-2.785,10.449-2.983,11.126-2.344c0.677,0.64-0.354,1.44-0.354,1.44 s0.73,0.832,1.333,2.111c0.604,1.28-0.792,1.665-0.792,1.665c1.852,6.718,9.877,14.935,9.877,14.935 c4.795,0.589,7.7,10.683,7.7,10.683l6.271,22.746C269.929,261.307,263.641,270.119,242.07,270.119z");
       path_a.attr({fill: 'none',stroke: '#231F20',"stroke-width": '3',"stroke-miterlimit": '10','stroke-opacity': '1'}).data('id', 'path_a');
       path_a.translate(i*30, 10);
       path_a.rotate(randomNumber3);

    }//end of for statement
}

$("input").keyup(function() {
    var value = parseInt($(this).val());
    paper.clear();
    if (value > 60) {
        drawBottles(3);
    }else if( value > 30){
        drawBottles(2);        
    } else if(value != 0  && 0 != value.length) {
        drawBottles(1);
    }//end of else statement
});

1 Ответ

2 голосов
/ 28 февраля 2012

Один из способов сделать это - проверить длину $ (this) .val () перед parseInt (). Если его длина равна нулю, очистите бумагу и используйте функцию keyup: 

 $("input").keyup(function() {
   var val = $(this).val();
   if (val.length == 0){
      paper.clear();
     return;        
   }
   ...

Вы можете увидеть это в действии здесь: http://jsfiddle.net/LmYm8/4/

...