2012-01-25 2 views
0

У меня есть эта функция, которая устанавливает ширину для моих входов и объявляет класс родительскому.Возможно ли отключить событие фокусировки при запуске .animate?

function inputWidth() { 
     $('input[disabled="disabled"]').removeAttr("disabled").prop("readonly", true); 
     $('input[type!="submit"]').focus(function(){ 
      if ($(this).val().length > 20) { 
       $(this).attr('data-default', $(this).width()); 
       $(this).animate({ 
        width: 350 
       }, 'slow'); 
       $(this).parent().addClass('cooling'); 
      } 
     }).blur(function(){ /* lookup the original width */ 
      var w = $(this).attr('data-default'); 
      $(this).animate({ 
       width: w 
      }, 'fast'); 
      $(this).parent().removeClass('cooling'); 
     }); 
    }; 

Моя проблема заключается в том, как я могу остановить нажмите событие, когда одушевленный работает, потому что если я много раз нажмите одновременно в 2-х входов на размывают входы не знает бежать обратно к исходному размеру.

Я прикрепил к вам принтер, чтобы лучше понять поведение. здесь: http://s17.postimage.org/j6kn0fr9b/fiddle.jpg и вот пример скрипки: http://jsfiddle.net/DCjYA/223/ спасибо.

ответ

1

Вы просто должны добавить .stop() к анимации и поля не будут возвращаться к своему первоначальному размеру, независимо от того, сколько раз вы щелкните здесь и там - http://jsfiddle.net/DCjYA/224/

+0

если вы щелкните несколько раз в том же самом входе остается для анимации размер :( ширина: 350 и не возвращается к исходному размеру ... – mcmwhfy

+1

Обновлено http://jsfiddle.net/DCjYA/225/ Это немного грязно, вам может понадобиться определить отдельную функцию для 'click 'и использовать это вместо повторения кода дважды, но у вас есть идея ;-) –

+0

спасибо, похоже, хорошо работает :) – mcmwhfy

Смежные вопросы