Проверка наличия текстового поля в Javascript

Это мой код, который должен был поднять сообщение alert, если текстовое поле осталось пустым:

function a(id)
{
    var n=document.getElementById(id).value;
    if (n.length < 1)
    {
        window.alert("Field is blank");
        return false;
    }
}

Ошибка, которую я получаю, заключается в том, что поле не получает подтверждение onChange в первый раз. Но когда текстовое поле заполнено некоторыми данными и стирается, теперь запускается onChange, и отображается сообщение alert. Как я могу исправить эту ошибку?

Ответ 1

onchange будет работать только в том случае, если значение текстового поля изменилось по сравнению с предыдущим значением, поэтому в первый раз оно не будет работать, потому что состояние не изменилось.

Поэтому лучше использовать событие onblur или при отправке формы.

function checkTextField(field) {
  document.getElementById("error").innerText =
    (field.value === "") ? "Field is empty." : "Field is filled.";
}

<input type="text" onblur="checkTextField(this);" />
<p id="error"></p>

Ответ 2

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

в любом случае, если вы хотите это на onchange, так что вот код.

function valid(id)
{
    var textVal=document.getElementById(id).value;
    if (!textVal.match(/\S/)) 
    {
        alert("Field is blank");
        return false;
    } 
    else 
    {
        return true;
    }
 }