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

Тема в разделе "JavaScript", создана пользователем iHits, 3 фев 2015.

Модераторы: ZiX
  1. iHits

    iHits Создатель

    Регистр.:
    4 фев 2014
    Сообщения:
    35
    Симпатии:
    1
    Автоматически заполоненное поле fieldset input через сохраненный логин и пароль работает некорректно.
    Текст заполненного поля выходит поверх текста подсказки поля.
    При заполненном поле текст подсказки должен быть сверху.
    Когда введено значение автоматически, то скрипт не определяет и подсказку не сдвигает. Нужно чтобы скрипт определил, что текст уже заполнено внутри и сдвинулся вверх.

    Наверно нужно что то дописать сюда:
    Код:
    <script type="text/javascript">
    $('input').on('blur', function(){
      if( !$(this).val() == "" ){
        $(this).next().addClass('stay');
      } else {
        $(this).next().removeClass('stay');
      }
    });
    </script>
    Ссылка на скрипт:
    http://codepen.io/iamjordanlittle/pen/AHdfn

    [​IMG]
     
  2. svfolder

    svfolder Постоялец

    Регистр.:
    31 июл 2013
    Сообщения:
    95
    Симпатии:
    39
    В хроме все прекрасно пашет!
    В каком браузере проверяете?
    Скорее всего проблема в несовместимости, возможно версии JQ
     
  3. iHits

    iHits Создатель

    Регистр.:
    4 фев 2014
    Сообщения:
    35
    Симпатии:
    1
    Работает и у меня в Chrome только когда в браузере есть сохраненный пароль и логин, и эти поля автоматически заполнены, то отображается не корректно.
     
  4. svfolder

    svfolder Постоялец

    Регистр.:
    31 июл 2013
    Сообщения:
    95
    Симпатии:
    39
    теперь понял суть вопроса.
    99.99% не решите проблему ибо в хроме поля что заполняются им автоматом, не управляемы.
    Я не один далеко, кто пытался эти поля контролировать CSS, у меня и моих знакомых это не вышло.
    Может конечно если заюзать какие то спецефические методы именно для хрома, как то и можно решить, но стандартные методы имхо не применимы.
     
    iHits нравится это.
  5. stealthdebuger

    stealthdebuger Механик

    Administrator
    Регистр.:
    25 авг 2008
    Сообщения:
    624
    Симпатии:
    1.379
    используйте $(document).ready();
     
    iHits и svfolder нравится это.
  6. iHits

    iHits Создатель

    Регистр.:
    4 фев 2014
    Сообщения:
    35
    Симпатии:
    1
    помогите с этим кусочком скрипта, буду очень благодарен. Я в js ноль =(
    если так, то не работает:

    Код:
    $(document).ready(function() {
        $('input').on('blur', function(){
          if( !$(this).val() == "" ){
            $(this).next().addClass('stay');
          } else {
            $(this).next().removeClass('stay');
          }
        });
    });
     
    Последнее редактирование: 4 фев 2015
  7. svfolder

    svfolder Постоялец

    Регистр.:
    31 июл 2013
    Сообщения:
    95
    Симпатии:
    39
    Да так.
    Или в такое еще можно обернуть, вместо $(document).ready

    (function($){


    Ваш код:


    })(jQuery);


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

    upload_2015-2-4_9-18-5.png
     
    Последнее редактирование: 4 фев 2015
    rebux и iHits нравится это.
  8. iHits

    iHits Создатель

    Регистр.:
    4 фев 2014
    Сообщения:
    35
    Симпатии:
    1
    Вот есть вариант, он работает.
    Код:
    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 нравится это.
  9. svfolder

    svfolder Постоялец

    Регистр.:
    31 июл 2013
    Сообщения:
    95
    Симпатии:
    39
    Вот как раз то о чем я и говорил, полностью специфичный вариант решения вопроса именно в хроме.
    Остается вопрос, в FF, Opera и IE проблем аналогичных нету?
     
  10. iHits

    iHits Создатель

    Регистр.:
    4 фев 2014
    Сообщения:
    35
    Симпатии:
    1
    В IE проверял- не работает.
    Тот парень что помог написал:
    Так что или нужно ждать чтобы поумнели, или нужно для каждого браузера отдельно искать решение. =)