2017-07-30 4 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それは働いた。コーディング中にもっと注意しなければならないようです...ありがとう –

関連する問題