Как поправить JS для корректной работы input поля?

[iHits]

Автоматически заполоненное поле fieldset input через сохраненный логин и пароль работает некорректно.
Текст заполненного поля выходит поверх текста подсказки поля.
При заполненном поле текст подсказки должен быть сверху.
Когда введено значение автоматически, то скрипт не определяет и подсказку не сдвигает. Нужно чтобы скрипт определил, что текст уже заполнено внутри и сдвинулся вверх.

Наверно нужно что то дописать сюда:

<script type="text/javascript">
$('input').on('blur', function(){
  if( !$(this).val() == "" ){
    $(this).next().addClass('stay');
  } else {
    $(this).next().removeClass('stay');
  }
});
</script>

Ссылка на скрипт:
Для просмотра ссылки Войди или Зарегистрируйся

 

[svfolder]

В хроме все прекрасно пашет!
В каком браузере проверяете?
Скорее всего проблема в несовместимости, возможно версии JQ

 

[iHits]

В хроме все прекрасно пашет!
В каком браузере проверяете?
Скорее всего проблема в несовместимости, возможно версии JQ

Работает и у меня в Chrome только когда в браузере есть сохраненный пароль и логин, и эти поля автоматически заполнены, то отображается не корректно.

 

[svfolder]

теперь понял суть вопроса.
99.99% не решите проблему ибо в хроме поля что заполняются им автоматом, не управляемы.
Я не один далеко, кто пытался эти поля контролировать CSS, у меня и моих знакомых это не вышло.
Может конечно если заюзать какие то спецефические методы именно для хрома, как то и можно решить, но стандартные методы имхо не применимы.

 

[stealthdebuger]

используйте $(document).ready();

 

[iHits]

используйте $(document).ready();

помогите с этим кусочком скрипта, буду очень благодарен. Я в js ноль =(
если так, то не работает:

$(document).ready(function() {
    $('input').on('blur', function(){
      if( !$(this).val() == "" ){
        $(this).next().addClass('stay');
      } else {
        $(this).next().removeClass('stay');
      }
    });
});

 

[svfolder]

Да так.
Или в такое еще можно обернуть, вместо $(document).ready

(function($){


Ваш код:


})(jQuery);


Вот скрин поясняющий почему у вас ничего не выйдет. Поля заполнены браузером, но в коде нету значений, JS не видит эти значения! JQuery работает с DOM а в DOM этих значений нету!

 

[iHits]

Вот есть вариант, он работает.

if (navigator.userAgent.toLowerCase().indexOf("chrome") >= 0) {
    $(window).load(function(){
        $('input:-webkit-autofill').each(function(){
           var id = $(this).attr('id');
            $('label[for='+id+']').addClass('stay');
        });
    });
}

 

[svfolder]

Вот как раз то о чем я и говорил, полностью специфичный вариант решения вопроса именно в хроме.
Остается вопрос, в FF, Opera и IE проблем аналогичных нету?

 

[iHits]

Вот как раз то о чем я и говорил, полностью специфичный вариант решения вопроса именно в хроме.
Остается вопрос, в FF, Opera и IE проблем аналогичных нету?

В IE проверял- не работает.
Тот парень что помог написал:

Да, в остальных наверное будет работать лишь тогда когда их разработчики поумнеют )

Так что или нужно ждать чтобы поумнели, или нужно для каждого браузера отдельно искать решение. =)