Javascript-验证表单（如果发现错误）将表单字段背景颜色更改为红色

Question

我有一个表格，当用户单击字段时，值将清除，当用户单击提交时，并且发现错误，该字段的背景色应更改为红色。

我的问题

当用户单击时，我设法清除了该字段的值，并且当发现错误时，我设法将该字段的颜色更改为红色，但是当用户单击时，当发现错误时，该字段的颜色提交仅将背景色更改为红色持续一秒钟，然后字段值再次增加。 我整天都在努力解决这个问题，我们将不胜感激，代码如下：

function validate(){
    //form validation
    var name=document.getElementById('name');
     if (name.value == null || name.value==""){
       name.style.backgroundColor="red";
     }  

<form id="enquire" method="post">
    <h2>Test Drive an Audi Today</h2>
    <input type="text"  value="Name" class="textbox" id="name" name="name" onclick="if(this.value=='Name') this.value='';" /><br />


<input type="submit" name="submit" class="butt" value="Send" onclick="validate()"  />
       <span class="buttonText">We'll Call you Back!</span>
    </form>

Answer 1

更改

<input type="submit" name="submit" class="butt" value="Send" onclick="validate()"  />
       <span class="buttonText">We'll Call you Back!</span>

至

<input type="submit" name="submit" class="butt" value="Send" onclick="return validate()"  />
       <span class="buttonText">We'll Call you Back!</span>

Answer 2

该函数的右括号缺失。

function validate(){
    //form validation
    var name=document.getElementById('name');
     if (name.value == null || name.value==""){
       name.style.backgroundColor="red";
       return false;    // add this line
     }
}   // This was missing