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

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

2 个答案: