Не нравятся результаты поиска? Попробуйте другой поиск!
dle-faq.ru FAQ (все вопросы) Стили (CSS) Как поправить JS для корректной работы input поля?

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


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

вопрос
Автоматически заполоненное поле 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
3

83 | 28

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

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

FastFud
50

1599 | 588

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

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

enterlive
3

83 | 28

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

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

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

enterlive
3

83 | 28

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


Должно быть вот как:

FastFud
50

1599 | 588

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

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

enterlive
3

83 | 28

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

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

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

enterlive
3

83 | 28

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


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

FastFud
50

1599 | 588

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
3

83 | 28

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

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

нет, не работает

blacksand
9

58 | 4

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

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

FastFud
50

1599 | 588

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
3

83 | 28

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
50

1599 | 588

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

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

enterlive
3

83 | 28

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

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

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

enterlive
3

83 | 28

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

ДЕЛЕТЕД

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

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