4

割り当てを実行しようとしていますが、コードを検証するのに問題があります。問題は、「@」が存在するかどうかを確認するためにフォームにメールテキストボックスが必要ですが、同じフォームでも名前テキストボックスが空かどうかを確認する必要があることです。一度に動作させることができるのはそのうちの 1 つだけです。

これは私のコーディングです。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>Weclome to the Recipe Collection Website</title>
    <script>
    function validateForm()
    {
    var x=document.forms["myForm"]["name"].value;
    if (x==null || x=="")
     {
     alert("Name text box must be filled out");
     return false;
     }
    </script>
    <script>
    function checkEmail()
    {
    var y=document.forms["myForm"]["email"].value;
    var atpos=y.indexOf("@");
    var dotpos=y.lastIndexOf(".");
    if (atpos<1 || dotpos<atpos+2 || dotpos+2>=y.length)
     {
     alert("Not a valid e-mail address");
     return false;
     }
    }
    </script>
  </head>
  <body>
    <form name="myForm" onsubmit="return validateForm()" method="post">
        Name: <input type="text" name="name"><br>
        Email: <input type="text" name="email"><br>
        Number of recipes previously submitted: <input type="radio" name="recipes" value="0">0<br>
        <input type="radio" name="recipes" value="1-2">1-2<br>
        <input type="radio" name="recipes" value="3-4">3-4<br>
        <input type="radio" name="recipes" value="5+">5+<br>
        Have you ever submitted recipes to another site?: <input type="radio" name="othersite" value="yes">Yes<br>
        <input type="radio" name="othersite" value="no" checked>No<br>
        <input type="submit" value="Submit">
    </form>
  </body>
</html>

この道はずれですか？

助けてくれてありがとう。

4

2 に答える 2

2

動作中のjsFiddleデモ

問題の根本的な原因は、すべてが問題ない場合でも、検証メソッドから誤った値を返すことです。

最初の簡単な部分は、2 つの方法を組み合わせることです。

私はインラインjsを行いませんが、あなたが持っているものに固執します...両方の機能を組み合わせたメソッドを作成するだけです:

<script>
function doBoth() {
    return validateForm() && checkEmail();
}
<script>

...

<form name="myForm" onsubmit="return doBoth()" method="post">

2つ目は、短絡の問題を修正することです

ただし、2 つのメソッドにエラーがあり、それらから暗黙的に返さundefinedれています。undefinedは falsey であるためdoBoth、2 番目の方法には決して到達しません。これは短絡によるものです。JS は怠惰なので、&&ステートメントの最初の部分が false の場合、JS は停止し、2 番目の部分を評価しません。これは、ステートメント全体が true になる方法がなくなったためです。

この問題の解決策は、問題がtrueないことが検証された場合に戻ることです。

また、閉じ括弧が欠落していることに注意してくださいvalidateForm

<script>

function validateForm()
{
    var x=document.forms["myForm"]["name"].value;
    if (x==null || x=="")
    {
        alert("Name text box must be filled out");
        return false;
    }

    // everything ok *this is a MUST to return*
    return true;
}

function checkEmail()
{
    var y=document.forms["myForm"]["email"].value;
    var atpos=y.indexOf("@");
    var dotpos=y.lastIndexOf(".");

    if (atpos<1 || dotpos<atpos+2 || dotpos+2>=y.length)
    {
        alert("Not a valid e-mail address");
        return false;
    }

    // everything ok *this is a MUST to return*
    return true;
}
</script>
于 2012-10-23T07:45:36.507 に答える
1

私はあなたがこれをどこから拾ったか知っています、これを試してください

<script type="text/javascript">
function validateForm() {
var x=document.forms["myForm"]["fname"].value;
if (x==null || x=="") {
  alert("First name must be filled out");
  return false;
}

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>
于 2012-10-23T07:44:36.207 に答える