如何禁用背景

我正在使用JavaScript进行表单验证。 提交时,那些无效的输入字段的背景颜色会更改为红色。 填写此字段并在另一个输入字段中键入时,前一个字段的红色背景色应消失。 目前情况并非如此。 它只会在再次提交时消失。 如何让这可能使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:

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

更新:我尝试过,但它似乎不工作:

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();

这里是它的例子

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

现在你可以在JavaScript上输入

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

checkFilled();

这里演示工作


尝试

$(formElement).on('keyup','input.error', function(){
    if(<values changed>){
        $(this).removeClass('error');
    }
});
链接地址: http://www.djcxy.com/p/70513.html

上一篇: how to disable background

下一篇: Change Background color of input field using JavaScript