2017-02-14 21 views
1

これは簡単なコードで、どこが間違っているのか分かりません。名前が入力されていないと名前の検証が機能しますが、名前が入力されます。私はここから助けを得るだろう期待して、HTMLとJavaScriptでちょうど新たなんだJavascriptのバリデーション(Submitをクリックした後に入力が表示されない)

は、ここに私のコードです。ここ

function checkname(form) { 
 
    var eobj = document.getElementById('MITname'); 
 
    var jname = form.Name.value; 
 
    var error = false; 
 

 
    eobj.innerHTML = ''; 
 

 
    if (jname == '') { 
 
     error = "Name is required!"; 
 
     var error2 = error.fontcolor("red"); 
 

 
    } 
 
    if (error) { 
 
     if (hasFocus == false) { 
 
     form.Name.focus(); 
 
     hasFocus = true; 
 
     } 
 
     eobj.innerHTML = error2; 
 
     return false; 
 
    } 
 
    return true; 
 
    } 
 

 
    function showinput() { 
 
    document.getElementById('namedisplay').innerHTML = document.getElementById('MITname').value; 
 
    } 
 

 

 
    function validate() { 
 
    hasFocus = false; 
 
    var form = document.forms['form']; 
 
    var ary = [checkname]; 
 
    var rtn = true; 
 
    var z0 = 0; 
 
    for (var z0 = 0; z0 < ary.length; z0++) { 
 
     if (!ary[z0](form)) { 
 
     rtn = false; 
 
     } 
 
    } 
 
    return rtn; 
 
    }
<form action="" name="form" onsubmit="return validate()"> 
 
    <tr> 
 
    <td align="right">Name:<font color="red">*</font> 
 
    </td> 
 
    <td> 
 
     <input type="text" name="Name" /> <span id="MITname"> </span> 
 
    </td> 
 
    </tr> 
 
    <br/> 
 
    <input type="submit" value="Submit" onclick="showinput()" /> 
 
    <br/> 
 
    <label>Your input:</label> 
 
    <p><span id="namedisplay"></span> 
 
    </p> 
 
</form>

答えて

0

いくつかの問題、ありがとうございました。

最初に、変数hasFocusを実際に作成することはありません。だからあなたは実際にそれが真実か偽かをチェックすることは決してありません。あなたがそれにアクセスしようとすると、error2を作成する第二には、それだけで、それが作成されたif()ブロック内でアクセス可能になることを意味し

。だから、次if(error)ブロックで、それはundefinedを返します。

第3に、errorを作成すると、値がfalseに設定されます。これはブール型を示しますが、後でその値をブール値ではない文字列に設定します。

第4に、var ary = [checkname];行が私に混乱しています。私はあなたが名前(入力から?)を配列に変換しようとしているのですが、それはそれを行う方法ではありません。 string.charAt(index)で名前の各文字にアクセスできるので、配列を作成する必要はありません。

第5に、ご使用のvalidate()は全体としてはです。が混乱しています。私はあなたがしようとしていることの手がかりを持っていません。あなたの教材があなたを誤解しているか、それほど注意を払っていないようです。

しかし、それらの(他の)問題の中で、何が間違っているのかを正確に突き止めるのは難しいです。私はあなたのためにこれを書いたくないので、私の提案はおそらく別のソースから、おそらくもう少しチュートリアルをチェックアウトすることでしょう。 (別のYouTubeチャンネルなど)

+0

私は、validate関数がすべてのフォームの配列を作成し、フォームごとに 'checkname'を呼び出さなければならないと仮定しています。代わりに、1つの変数配列を繰り返して' checkname'を呼び出します。 – abc123

+1

クラスの最初の日ですそれは自己教えている..私は私は何をコーディングしているのか分かりませんが、JavaScriptの検証を行うことを目指しています。このコードが恐ろしいことを知っています。それは少し下です。*一口*ありがとう。 –

+0

@ Geni様、気分は悪くない、私達はどこかに出発しなければならなかった。私がやっていることは、初心者のために素晴らしい "Javascriptの紹介"ビデオをオンラインで見て、W3 Schoolsを見ていることです。 – FibreChips

0

私の問題は検証です。空白の名前を入力すると、名前のテキストボックスの横にエラーメッセージが表示され、有効な名前を入力するよう指示されます。

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <title>JAVASCRIPT FORM VALIDATION</title> 
 
\t 
 
    <script type="text/JavaScript"> 
 
     function showMessage() 
 
\t \t { 
 
      var Name = document.getElementById("Name").value; 
 
      displayname.innerHTML= Name; 
 
\t \t \t 
 
\t \t \t var Email = document.getElementById("Email").value; 
 
\t \t \t displayemail.innerHTML= Email; 
 
\t \t \t 
 
\t \t \t var Website = document.getElementById("Website").value; 
 
\t \t \t displaywebsite.innerHTML= Website; 
 
\t \t \t 
 
\t \t \t var Comment = document.getElementById("Comment").value; 
 
\t \t \t displaycomment.innerHTML= Comment; 
 
\t \t \t 
 
\t \t \t var nameerror=''; 
 
\t \t \t var emailerror=''; 
 
\t \t \t var websiteerror=''; 
 
\t \t \t var commenterror=''; 
 
\t \t \t 
 
\t \t \t \t if (displayname.innerHTML=='') 
 
\t \t \t \t { 
 
\t \t \t \t nameerror = 'Please enter a valid name'; 
 
\t \t \t \t return false; 
 
\t \t \t \t } 
 
\t \t \t \t return true; 
 
     } 
 
    </script> 
 
\t 
 
</head> 
 

 
<body> 
 

 
Name: <input type="text" id = "Name"> <span id = "nameerror"> </span> 
 
<br></br> 
 
Email: <input type="text" id = "Email"> 
 
<br></br> 
 
Website: <input type="text" id = "Website"> 
 
<br></br> 
 
Comnent: <textarea cols="35" rows="7" id="Comment"> </textarea> 
 
<br></br> 
 

 
<input type="submit" onclick="showMessage()" value="submit" /> 
 

 
\t \t \t <p>Name: <span id = "displayname"></span> </p> 
 
\t \t \t <p>Email: <span id = "displayemail"></span> </p> 
 
\t \t \t <p>Website: <span id = "displaywebsite"></span> </p> 
 
\t \t \t <p>Comment: <span id = "displaycomment"></span> </p> 
 

 

 
</body> 
 
</html>

0
<form action="" name="form" onsubmit="return validate()"> 
    <tr> 
    <td align="right">Name:<font color="red">*</font> 
    </td> 
    <td> 
     <input type="text" name="Name" /> <span id="MITname"> </span> 
    </td> 
    </tr> 
    <br/> 
    <input type="button" value="Submit" onclick="showinput()" /> 
    <br/> 
    <label>Your input:</label> 
    <p><span id="namedisplay"></span> 
    </p> 
</form> 

はちょうどそれは、あなたがクリックするのがPOSTに変更されたデータを送信すると、クリックしながら、あなたのページを提出し、だから、タイプ

としてボタンを使用するコード内で「提出」=タイプを削除します
関連する問題