-1

ユニプロジェクトのフォームで基本的なデータ検証を機能させようとしています。しかし、私が呼び出そうとしているjavascript関数はまったくアクセスされていないようで、その理由を理解できていません。

これが私のHTMLです:

<!DOCTYPE HTML>

<HTML>

<HEAD>

<meta http-equiv="Content-type" content="text/html;charset=UTF-8"> 

<TITLE>Make an Order</TITLE>

<link href="design/css/style.css" rel="stylesheet" type="text/css">
<script src="design/scripts/Validator.js" language="javascript" type="text/javascript"></script>

</HEAD>

<BODY>

<div id="container">

    <form id="guestbook" method="post" action="index.html" onsubmit="return Validator(this);">
        <fieldset>
            <legend>
                Personal information
            </legend>
            <label for=name>Name:</label>
            <input id=name name=name type=text placeholder="Your name" required autofocus><br />
            <label for=email>Email:             </label>
            <input id=email name=email type=text placeholder="Your email address" required><br />
            <label for=phnumber>Phone number:       </label>
            <input id=phnumber name=phnumber type=text placeholder="Your telephone number" required><br />
        </fieldset>

        <fieldset>
            <legend>
                Order details
            </legend>
            Choose whether you would like to order an image, video, or both:<br />
            <input id=image name=order_type type=checkbox value="Image"><label for=image>$100 Image:</label><br />
            <input id=video name=order_type type=checkbox value="Video"><label for=video>$95/frame Video:</label><br />
            <label for=url>URL of image to modify:  </label>
            <input id=url name=url type=text placeholder="URL of image" required><br />
        </fieldset>

        <fieldset>
            <legend>
                Credit card details
            </legend>
            <label for=ccnumber>Credit card number:</label>
            <input id=ccnumber name=ccnumber type=text placeholder="Your credit card number" required><br />
            <label for=bsbnumber>BSB number:</label>
            <input id=bsbnumber name=bsbnumber type=text placeholder="Your BSB number" required><br />
        </fieldset>

        <div class="buttons">
            <input type="submit" value="Submit" />
            <input type="reset" value="Reset" />
        </div>

    </form>

    <div id="footer">
        <p>website by etc</p>
    </div>

</div>

</BODY>

</HTML>

そして、これが私の外部javascriptファイルValidator.jsです:

function Validator(theForm)
{
    var errorinit = "Error(s) detected. Please amend before continuing:\n";
    var error = errorinit;

    //check that at least one checkbox (to choose either image or video) has been selected
    var boxChecked = false;
    if (theForm.image.checked == true && theForm.video.checked == true)
    {
        boxChecked = true;
    }
    if (boxChecked == false)
    {
        error += " - You must select at least a video or an image.\n"
        break;
    }

    //check that numerical-only inputs have numbers (but allowing for habitual spaces or dashes) only
    var digits = "0123456789- ";
    var temp = null;
    for (var i = 0; i < theForm.phnumber.value.length; i++)
    {
        temp = theForm.phnumber.value.substring(i, i+1)

        if (digits.indexOf(temp) == -1 && theForm.phnumber.value != "")
        {
            error += " - Your phone number must be numerical only.\n";
            break;
        }
    }
    for (var i = 0; i < theForm.ccnumber.value.length; i++)
    {
        temp = theForm.ccnumber.value.substring(i, i+1)

        if (digits.indexOf(temp) == -1 && theForm.ccnumber.value != "")
        {
            error += " - Your credit card number must be numerical only.\n";
            break;
        }
    }
    for (var i = 0; i < theForm.bsbnumber.value.length; i++)
    {
        temp = theForm.bsbnumber.value.substring(i, i+1)

        if (digits.indexOf(temp) == -1 && theForm.bsbnumber.value != "")
        {
            error += " - Your bsb number must be numerical only.\n";
            break;
        }
    }

    //check that the email address contains an @ symbol
    if ((theForm.email.value.indexOf ('@',0) == -1 || theForm.email.value.indexOf ('.',0) == -1) && theForm.email.value != "")
    {
        error += " - Your email address is invalid.";
    }

    //check if there has been any error
    if (error != errorinit)
    {
        alert(error);
        return (false);
    } else {
        alert("no problems");
        return (true);
    }
}

これはかなり単純なコードなので、チェックして再チェックした後、なぜそれが機能しないのかについて困惑しています。javascriptでわかるように、エラーが発生したかどうかに関係なくアラートをスローするように設定しましたが、アラートはまったく表示されません。検証なしでindex.htmlに戻るだけです(「必須」フィールドは別として)。

これが機能しない理由を誰かが指摘できますか?

4

1 に答える 1

1

これはあなたのコードにあるエラーです:

SyntaxError: unlabeled break must be inside loop or switch

あなたはbreak;それを壊すためにスイッチやループにいない間に以下の部分で使用しています:

if (boxChecked == false)
{
    error += " - You must select at least a video or an image.\n"
    break;
}

この問題を解決するには、次のように置き換えbreak;ますreturn false;...

于 2012-09-15T06:58:06.867 に答える