如何在javascript中提交表单后清除错误消息

Question

Hi guys The below coding was to be work fine what is the problem is after submitting a form i need to disable the Error message at the below of the each textbox of the form.o please tell me how to rectify it.... 嗨伙计下面的编码是工作正常问题是提交表单后我需要在form的每个文本框的下面禁用错误消息。请告诉我如何纠正它....

 function asd() { var res = document.forms.myForm.length; flag = true; for (var i = 0; i < res; i++) { if ((document.forms.myForm[i].tagName) != 'Button') { var x = document.forms.myForm[i].value; if (x == "" || x == null) { document.getElementsByClassName("Required")[i].innerHTML = "required"; document.getElementsByClassName("Required")[i].style.color = "red"; document.getElementsByClassName("TagColor")[i].style.border = "1px solid red"; document.getElementsByClassName("TagColor")[i].style.background = "lightblue"; /*flag=false;*/ } else if (x == "text") { document.getElementsByClassName("Required")[i].innerHTML = "qwe"; document.getElementsByClassName("Required")[i].style.color = "green"; document.getElementsByClassName("TagColor")[i].style.border = "1px solid red"; document.getElementsByClassName("TagColor")[i].style.background = "lightblue"; flag = false; } } } var gen = document.getElementsByName("gender"); if ((gen[0].checked == false) && (gen[1].checked == false)) { document.getElementById("WrongMsg").innerHTML = "required"; document.getElementById("WrongMsg").style.color = "red"; flag = false; } var c = document.getElementsByName("chec"); if ((c[0].checked == false) && (c[1].checked == false)) { document.getElementById("ErrorMsg").innerHTML = "required"; document.getElementById("ErrorMsg").style.color = "red"; flag = false; } return flag; }

  <!DOCTYPE html> <html> <head> <title>Form Validation</title> <link rel="stylesheet" href="css/form1.css"> </head> <body> <div class="Divstyle"> <h1>Form Validation</h1> <form name="myForm" onsubmit="return asd()" onchange="reset(form)"> FirstName:<input type="text" class="TagColor" name="fname"/><br><span class="Required"></span><br> LastName:<input type="text" class="TagColor" name="lname"/><br><span class="Required"></span><br> Phone Num:<input type="text" class="TagColor" name="phno"/><br><span class="Required"></span><br> Email:<input type="email" class="TagColor" name="email"/><br><span class="Required"></span><br> Select Country: <select class="TagColor"> <option value="">Select</option> <option value="one">INDIA</option> <option value="two">PAKISTAN</option> <option value="three">AUSTRALLIA</option> </select><br><span class="Required"></span><br> Gender: Male:<input type="radio" name="gender"/><br> Female:<input type="radio" name="gender"/><br><span id="WrongMsg"></span><br><br> Language: Tamil:<input type="checkbox" name="chec"><br> English:<input type="checkbox" name="chec"><br><span id="ErrorMsg"></span><br><br> <input type="submit" value="submit" name="submit"> </form> </div> </body> </html>

Answer 1

Try this: 尝试这个：

In the else part, for the required span tags, set the innerHTML to blank and make the color as transparent. 在else部分中，对于所需的span标记，将innerHTML设置为空白并使颜色变为透明。

if (x == "" || x == null) {
    ....
} else if (x != null) {
     document.getElementsByClassName("Required")[i].innerHTML = "";
     document.getElementsByClassName("Required")[i].style.color = "transparent";
     document.getElementsByClassName("TagColor")[i].style.border = "1px solid green";
     document.getElementsByClassName("TagColor")[i].style.background = "lightblue";
}

 function asd() { var res = document.forms.myForm.length; flag = true; for (var i = 0; i < res; i++) { if ((document.forms.myForm[i].className) == 'TagColor') { var x = document.forms.myForm[i].value; if (x == "" || x == null) { document.getElementsByClassName("Required")[i].innerHTML = "required"; document.getElementsByClassName("Required")[i].style.color = "red"; document.getElementsByClassName("TagColor")[i].style.border = "1px solid red"; document.getElementsByClassName("TagColor")[i].style.background = "lightblue"; flag=false; } else if (x != null) { document.getElementsByClassName("Required")[i].innerHTML = ""; document.getElementsByClassName("Required")[i].style.color = "transparent"; document.getElementsByClassName("TagColor")[i].style.border = "1px solid green"; document.getElementsByClassName("TagColor")[i].style.background = "lightblue"; //flag = false; } } } var gen = document.getElementsByName("gender"); if ((gen[0].checked == false) && (gen[1].checked == false)) { document.getElementById("WrongMsg").innerHTML = "required"; document.getElementById("WrongMsg").style.color = "red"; flag = false; } else { document.getElementById("WrongMsg").innerHTML = ""; } var c = document.getElementsByName("chec"); if ((c[0].checked == false) && (c[1].checked == false)) { document.getElementById("ErrorMsg").innerHTML = "required"; document.getElementById("ErrorMsg").style.color = "red"; flag = false; } else { document.getElementById("ErrorMsg").innerHTML = ""; } return flag; }

 <!DOCTYPE html> <html> <head> <title>Form Validation</title> <link rel="stylesheet" href="css/form1.css"> </head> <body> <div class="Divstyle"> <h1>Form Validation</h1> <form name="myForm" onsubmit="return asd()" onchange="reset(form)"> FirstName:<input type="text" class="TagColor" name="fname"/><br><span class="Required"></span><br> LastName:<input type="text" class="TagColor" name="lname"/><br><span class="Required"></span><br> Phone Num:<input type="text" class="TagColor" name="phno"/><br><span class="Required"></span><br> Email:<input type="email" class="TagColor" name="email"/><br><span class="Required"></span><br> Select Country: <select class="TagColor"> <option value="">Select</option> <option value="one">INDIA</option> <option value="two">PAKISTAN</option> <option value="three">AUSTRALLIA</option> </select><br><span class="Required"></span><br> Gender: Male:<input type="radio" name="gender"/><br> Female:<input type="radio" name="gender"/><br><span id="WrongMsg"></span><br><br> Language: Tamil:<input type="checkbox" name="chec"><br> English:<input type="checkbox" name="chec"><br><span id="ErrorMsg"></span><br><br> <input type="submit" value="submit" name="submit"> </form> </div> </body> </html>

如何在javascript中提交表单后清除错误消息

问题描述

1 个解决方案

解决方案1
0 2016-06-16 12:34:24

如何在javascript中提交表单后清除错误消息

问题描述

1 个解决方案

解决方案1 0 2016-06-16 12:34:24

解决方案1
0 2016-06-16 12:34:24