2011-06-29 12 views
8

私はこのコードをW3Schoolsで見つけました。それはJavascriptでのフォーム検証に関するものです。フォーム検証PHPでjavadript

ユーザーテープの間違ったメール形式では、警告が表示されます。

私がフォームonsubmit="return validateForm();に表示されているコードをチェックすると、関数はエラーの場合にfalseを返します。

私の質問は、PHPでメッセージボックスを使用する代わりにエラーメッセージを書き込むためにjavascriptからブール値を取得する方法です。

これは私のコードです:事前に

<html> 
<head> 
    <script type="text/javascript"> 
    function validateForm() 
    { 
    var x=document.forms["myForm"]["email"].value 
    var atpos=x.indexOf("@"); 
    var dotpos=x.lastIndexOf("."); 
    if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length) 
     { 
     alert("Not a valid e-mail address"); 
     return false; 
     } 
    } 
    </script> 
    </head> 

    <body> 
    <form name="myForm" action="demo_form.asp" onsubmit="return validateForm();" method="post"> 
    Email: <input type="text" name="email"> 
    <input type="submit" value="Submit"> 
    </form> 
</body> 

</html> 

感謝。

アリ
+3

W3Schoolは信頼できません:[W3Fools](http://w3fools.com/) – mc10

答えて

7

javascriptからブール値を取得することはできません。あなたがしなければならないことは、事前にerror divを準備しておくことです。このようなもの:

<body> 
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm();" method="post"> 
Email: <input type="text" name="email"> 
<div id="error"></div> 
<input type="submit" value="Submit"> 
</form> 

これを隠すためにCSSを追加してください。次に、検証フォームでjavascriptを使用してエラーdivのHTMLを変更します。

if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length) 
    { 
     document.getElementById("error").innerHTML="Not a valid e-mail address"; 
     return false; 
    } 

"return false;"パートは提出しないようにフォームに伝えることです。他の答えで述べたように、PHPとJavascriptはインターフェースしません。 PHPはサーバー側、Javascriptはクライアント側です。彼らはお互いに話をしません。ただし、両方ともHTMLを変更できます。 Javascriptは常にブラウザで実行されることを覚えておいてください。したがって、PHPに物事を送る必要がある場合は、AJAXを使用してサーバー側のPHPスクリプトを呼び出し、そのように情報を送信する必要があります。しかし、ほとんどの場合、Javascriptを使用している場合、情報を必要とするのはPHPではなく、ユーザーです。だから、Javascriptを使ってHTMLを修正するのは、このトリックです。

3

AJAXを使用していないと、あなたはできません。 PHPはサーバサイドの言語であり、JavaScriptはブラウザ上でクライアント上で動作することを覚えておいてください。 PHPがブラウザにページをレンダリングするまでに、処理が終了しました。必要なのは、JavaScript検証とPHP検証という2つの検証層です。どうして?ブラウザでJavaScriptをオフにすることができるためです。それはセキュリティ対策として役に立たない。 JavaScriptの検証は、ユーザーの操作性を向上させる方法としてのみ使用してください。

最後に、w3schoolsに行ってはいけません。その情報の多くは無効です(詳細はサイトhttp://www.w3fools.comを参照してください)。代わりに、Mozillaのデベロッパーネットワークを使用してください:https://developer.mozilla.org/en-US/learn/

3

もっとも簡単なことは、機能の表示を行うことです。以下のようなものでアラートを置き換えます - 。

のdocument.getElementById( "にErrorMessage")innerHTMLプロパティ= "有効ではありません 電子メールアドレス";

また、あなたのHTMLには、errormessageのIDを持つDIVが必要です。

6
if (..) 
{ 
    document.getElementByID('error').InnerHTML = "Not a valid e-mail address!"; 
    return false; 
} 
else 
{ 
    document.getElementByID('error').InnerHTML = ""; 
} 

し、あなたのマークアップの追加:

<span id="error"></span> 
3

私はこのためにPHPを使用することはありません。

この方法で、サーバーに戻る必要はありません。