2017-07-30 104 views
0

我試圖在不使用警報框的情況下顯示驗證錯誤消息。但它不工作。以前我已經成功地使用了「innerHTML」。但我不明白爲什麼它不起作用。這是我的代碼。在javascript/html中顯示錯誤消息而不使用警報

function validate() 
 
{ 
 
    if(document.regform.fname.value.length=="") 
 
    { 
 
     document.getElementById("error").innerHTML="error"; 
 
    }  
 
}
<header> 
 
    <h1>SIGN UP</h1> 
 
</header> 
 
<div class="div1"><img src="img.jpg" width="250px"></div> 
 
<div class="div2" id="div2"> 
 
    <form name="regform" onsubmit="return validate()"> 
 
    <label><input type="text" name="fName" id="fna"></label> 
 
    <input type="submit" name="submit" value="Sign Up" > 
 
    <p id="error"></p> 
 
    </form> 
 
</div> 
 

 
<footer></footer>

+1

讓我猜,你的表單只是閃爍,然後重新加載? – j08691

+2

[javascript如何在不使用警報的情況下創建驗證錯誤消息]的可能重複(https://stackoverflow.com/questions/13689832/javascript-how-to-create-a-validation-error-message-without-using-警報) – Nisarg

回答

0

有在你的代碼的一些錯誤。首先名稱是fName,但您使用的是fname,然後您必須用整數值非空字符串比較length

如果發生錯誤,您還想停止提交。因此,如果出現錯誤,則返回false。 試試這個。

function validate() { 
 
    if (document.regform.fName.value.length == '0') { 
 
    document.getElementById("error").innerHTML = "error"; 
 
    return false; 
 
    } 
 
}
<body> 
 
    <header> 
 
    <h1>SIGN UP</h1> 
 
    </header> 
 
    <div class="div2" id="div2"> 
 
    <form name="regform" onsubmit="return validate()"> 
 

 
     <label><input type="text" name="fName" id="fna"></label> 
 
     <input type="submit" name="submit" value="Sign Up"> 
 
     <p id="error"></p> 
 
    </form> 
 
    </div> 
 
    <footer></footer> 
 
</body>

希望工程。

+1

縮進你的答案,並做一個片段 – Durga

+0

@Anup它的工作。似乎我必須在編碼時更加小心。謝謝 –