Значение Chrome при загрузке

У меня есть некоторые проблемы с браузером Chrome, когда он запоминает пароль, имя пользователя и т.д. Я не могу проверить, пусто ли поле ввода. Я использую следующий код, но оператор if не работает в Chrome, пока он работает во всех других браузерах.

$(document).ready(function() {    
    $('.inputWithLabel').each(function(){
        if ($(this).val().length != 0){
            var element_id = $(this).attr('id');
            $('label[for="' + element_id + '"]').addClass('inputWithText');
        }
    });
});

Я попытался изменить следующие метки

<form action="" method="post">
    <div class="divInputLabel inputLabel">
        <label class="labelInput" for="username">Brugernavn*</label>
        <input class="inputLabel inputWithLabel" id="username" name="username" type="text">
    </div>
    <div class="divInputLabel inputLabel">
        <label class="labelInput" for="password">Adgangskode*</label>
        <input class="inputLabel inputWithLabel" id="password" name="password" type="password">
    </div>
    <div class="divInputLabel inputLabel">
        <label class="labelInput" for="password_again">Gentag adgangskode*</label>
        <input class="inputLabel inputWithLabel" id="password_again" name="password_again" type="password">
    </div>
    <div class="divInputLabel inputLabel">
        <label class="labelInput" for="first_name">Fornavn*</label>
        <input class="inputLabel inputWithLabel" id="first_name" name="first_name" type="text">
    </div>
    <div class="divInputLabel inputLabel">
        <label class="labelInput" for="last_name">Efternavn</label>
        <input class="inputLabel inputWithLabel" id="last_name" name="last_name" type="text">
    </div>
    <div class="divInputLabel inputLabel">
        <label class="labelInput" for="email">Email*</label>
        <input class="inputLabel inputWithLabel" id="email" name="email" type="text">
    </div>
    <div class="divInputLabel inputLabel">
        <input type="Submit" class="submit-button" value="Registre">
    </div>
</form>

Надеюсь, кто-то может мне помочь.

Ответ 1

Чтобы проверить и увидеть, пуст ли вход или нет, вы можете сделать что-то более простое.

$(document).ready(function() {
    $(".inputWithLabel").change(function() {
        if ($(this).val() == null || $(this).val() == "") {
            alert("Input is null!");
        } else {
            alert("Input is valid");
        }
    });
});

Ответ 2

Не меняйте свой код, применяйте это вместо:

$(document).ready(function() {

    $('.inputWithLabel').each(function(){
        if ($(this).val().length != 0 && $(this).val().length != null){
            var element_id = $(this).attr('id');
            $('label[for="' + element_id + '"]').addClass('inputWithText');
        }
    });
});

Установить && $(this).val().length != null только после $(this).val().length != 0, и он должен запускаться в разных браузерах. Попробуйте!

Ответ 3

Попробуйте использовать следующий код:

    $(document).ready(function() {
      $('body .inputWithLabel').each(function(){
        if ($(this).val().length != 0){
          var element_id = $(this).attr('id');
          $('label[for="' + element_id + '"]').addClass('inputWithText');
        }
      });
   });

Просто добавьте тело i.e $('body .inputWithLabel') в каждый цикл.

Ответ 4

Ваш код выглядит отлично... Ярлык не имеет .val().. если мы хотим, чтобы внутренний текст метки был таким .text() поэтому замените .val() на .text(), и он будет работать, надеюсь. Также сначала добавьте тело i.e
$('body .inputWithLabel')

Ответ 5

Попробуйте следующее:

$(document).ready(function() {

    $('.inputWithLabel').each(function() {
        if ($(this).val()) {
            var element_id = $(this).attr('id');
            $('label[for="' + element_id + '"]').addClass('inputWithText');
        }
    });
});

Ответ 6

Вы можете попробовать его на своем сайте

$('.inputWithLabel').each(function() {
    if ($(this).val() !== null && $(this).val() !== "") {
        var element_id = $(this).attr('id');
        $("#" + element_id).removeClass('inputWithLabel').addClass('inputWithText');
    }
});

Ответ 7

Я пробовал подобное. Все, что вам нужно сделать, это сначала превратить ваш идентификатор формы в переменную jQuery,

var $elem = document.getElementById("yourformid").value; //make sure your id has no # symbol
if ($elem > 0) {
    //do stuff
}

который должен работать.

Ответ 8

В настоящее время нет возможности определить, заполняется ли форма путем автозаполнения браузера. Некоторые альтернативы, которые я бы предложил, следующие:

Отключить автозаполнение: если вам это не нужно, это будет простое решение

<input autocomplete="off">

или на всей форме:

<form autocomplete="off">

Использование события изменения для обнаружения любых изменений в поле:

$('#username').on('change keyup',function(){
    // to something
});

Здесь я могу представить, чтобы установить класс, если есть какое-либо изменение в поле ввода, например:

$('#username').on('change keyup',function(){
    $(this).addClass('changed');
});

Или измените атрибут имени в представленном поле. например: используйте это как значение по умолчанию:

<input class="inputLabel inputWithLabel" id="username" name="usernameAutofill" type="text">

и измените его позже, если что-то сделано с вводом:

$('#username').on('change keyup',function(){
    $(this).attr('name', 'username');
});

Но прежде чем вы это сделаете, задайте себе следующие вопросы: Почему вы хотите доказать поля? Что должно произойти, если они автозаполняются? Что должно произойти, если они пусты? Что должно произойти, если они регулярно заполняются?

Поскольку какое решение лучше всего, во многом зависит от того, что именно вы хотите сделать. Если вы ответите на этот вопрос, мы можем вам помочь.

Ответ 9

попробуйте использовать:

$('').value

или

this.value

или

this.textContent

или

$('').innerHTML

Ответ 10

Ваш код проверяет каждый элемент ввода, у которого есть какое-то значение, а не те, которые пусты. Попробуйте изменить свое состояние на:

if ($(this).val().length == 0){
...

это добавит класс в пустую метку (метки) поля.