Задать вопрос
Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Стили (CSS) » Как поправить JS для корректной работы input поля?

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

     03.02.2015    Стили (CSS), jQuery    2639

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

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

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



Ответа пока нет

 

15 комментариев

enterlive
Юзер

enterlive - 3 февраля 2015 20:57 -

ребята помогите пожалуйста, очень надо, я в JS ноль =(
Там по любому две-три строки кода...
FastFud
Юзер

FastFud - 3 февраля 2015 21:08 -

Может проблема не в скрипте а в css ?)
enterlive
Юзер

enterlive - 3 февраля 2015 22:21 -

Цитата: FastFud
Может проблема не в скрипте а в css ?)

Тут в скрипте дело, потому что указывается при input-e что подсказку-текст нужно сдвинуть вверх. А когда введено значение автоматически, то скрипт не определяет и подсказку не сдвигает. Нужно чтобы скрипт определил, что текст уже заполнено внутри и сдвинулся вверх. CSS этого не сотворит.
enterlive
Юзер

enterlive - 3 февраля 2015 22:29 -

Должно быть вот как:
FastFud
Юзер

FastFud - 3 февраля 2015 22:37 -

За анимацию отвечает класс в css, функция на jQuery добавляет и удаляет лишь этот класс.
enterlive
Юзер

enterlive - 3 февраля 2015 22:57 -

Цитата: FastFud
За анимацию отвечает класс в css, функция на jQuery добавляет и удаляет лишь этот класс.

При чем здесь анимация? Анимация работает как в ссылке которую я скинул. Только когда сохранен в браузере логин и пароль, отображается некорректно. Это поправить в CSS невозможно! Если конечно не применить магию...
enterlive
Юзер

enterlive - 3 февраля 2015 23:00 -

Чтобы понять было проще
FastFud
Юзер

FastFud - 3 февраля 2015 23:19 -

Попробуйте так: 
$('input').each(function(){
  var inp = $(this),
      id = inp.attr('id');
  if (inp.val()) {
    $('[for='+id+']').addClass('stay');
  } else {
    inp.on('blur', function(){
    if( !$(this).val() == "" ){
      $(this).next().addClass('stay');
    } else {
      $(this).next().removeClass('stay');
    }
  });
  }
});
enterlive
Юзер

enterlive - 3 февраля 2015 23:25 -

Цитата: FastFud
Попробуйте так:

нет, не работает
blacksand
Юзер

blacksand - 4 февраля 2015 07:58 -

может ссылку проще дать ? что бы наглядно видеть проблему, а не добаный скрин
FastFud
Юзер

FastFud - 4 февраля 2015 10:23 - 

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');
        });
    });
}
enterlive
Юзер

enterlive - 4 февраля 2015 22:31 -

Цитата: FastFud
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');
        });
    });
}

Вав!!! Большое спасибо!!! Работает =) Только это будет работать под Chrome, или на всех браузерах?
FastFud
Юзер

FastFud - 4 февраля 2015 22:59 -

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

enterlive - 4 февраля 2015 23:04 -

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

Нужно ставить как ответ на вопрос в теме =)
Кстати если выполнил вход и потом выход ошибка повторяется. Только когда страница обновляется то снова работает скрипт. Как повторить эту функцию снова после выхода?
enterlive
Юзер

enterlive - 4 февраля 2015 22:59 -

ДЕЛЕТЕД
Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

 01.10.2011 compis  Стили (CSS)
 26.01.2012 1KoTuK  Стили (CSS)
 07.07.2012 ayy_jay  Шаблоны (TPL), Стили (CSS), jQuery
 21.10.2012 wcw2007  Стили (CSS), jQuery
 06.02.2013 maggotische  Стили (CSS), jQuery
 01.04.2013 Heon  Шаблоны (TPL), Стили (CSS)
 10.08.2013 G-Force  Стили (CSS), jQuery
 29.10.2014 G-3p  Общие вопросы по вёрстке, Стили (CSS)
 10.11.2014 jekonya  Стили (CSS)
 14.05.2015 evenegrad  Стили (CSS)
наверх