배경색 입력란을 사용 중지하는 방법

Question

자바 스크립트로 양식 유효성 검사를 사용하고 있습니다. 제출할 때 유효하지 않은 입력 필드의 배경색이 빨간색으로 바뀝니다. 이 입력란을 채우고 다른 입력란에 입력하면 이전 입력란의 빨간색 배경색이 사라집니다. 지금은 그렇지 않습니다. 다시 제출할 때만 사라집니다. 다른 필드에 타이핑 할 때 bg 색상이 다시 정상적으로 변경되도록하려면 어떻게해야합니까?

// Return true if the input value is not empty 
function isNotEmpty(inputId, errorMsg) { 
var inputElement = document.getElementById(inputId); 
var errorElement = document.getElementById(inputId + "Error"); 
var inputValue = inputElement.value.trim(); 
var isValid = (inputValue.length !== 0); // boolean 
showMessage(isValid, inputElement, errorMsg, errorElement); 
return isValid; 
} 

/* If "isValid" is false, print the errorMsg; else, reset to normal display. 
* The errorMsg shall be displayed on errorElement if it exists; 
* otherwise via an alert(). 
*/ 
function showMessage(isValid, inputElement, errorMsg, errorElement) { 
if (!isValid) { 
    // Put up error message on errorElement or via alert() 
    if (errorElement !== null) { 
    errorElement.innerHTML = errorMsg; 
    } else { 
    alert(errorMsg); 
    } 
    // Change "class" of inputElement, so that CSS displays differently 
    if (inputElement !== null) { 
    inputElement.className = "error"; 
    inputElement.focus(); 
    } 
    } else { 
    // Reset to normal display 
    if (errorElement !== null) { 
    errorElement.innerHTML = ""; 
    } 
    if (inputElement !== null) { 
    inputElement.className = ""; 
    } 
    } 
} 

형태 :

<td>Name<span class="red">*</span></td> 
    <td><input type="text" id="name" name="firstname"/></td> 
    <p id="nameError" class="red">&nbsp;</p> 

가 제출

<input type="submit" value="SEND" id="submit"/> 

CSS는 : 나는이 B를 시도 : 업데이트

input.error { /* for the error input text fields */ 
background-color: #fbc0c0; 
} 

유타는 작동하지 않는 것 같습니다 : 시도 demo

Answer 1

을 여기

<input type="text" id="subEmail" onchange="checkFilled();"/> 

을의 예를 지금

$(formElement).on('keyup','input.error', function(){ 
    if(<values changed>){ 
     $(this).removeClass('error'); 
    } 
}); 

Answer 2

작업 입력 여기

function checkFilled() { 
var inputVal = document.getElementById("subEmail").value; 
if (inputVal == "") { 
    document.getElementById("subEmail").style.backgroundColor = "white"; 
} 
else{ 
    document.getElementById("subEmail").style.backgroundColor = "red"; 
} 
} 

checkFilled(); 

에 당신이 할 수있는 자바 스크립트를

function checkFilled() { 
var inputVal = document.querySelectorAll("#offerteFirstname, #offerteLastname, #offertePhone, #offertePoster, #offerteStreet").value; 
if (inputVal == "") { 
    document.querySelectorAll("#offerteFirstname, #offerteLastname, #offertePhone, #offertePoster, #offerteStreet").style.backgroundColor = "red"; 
} 
else{ 
    document.querySelectorAll("#offerteFirstname, #offerteLastname, #offertePhone, #offertePoster, #offerteStreet").style.backgroundColor = "white"; 
} 
} 

checkFilled();