10

以下のコードを修正してください。期待どおりに機能していません。つまり、ユーザーが無効な名前を入力したときに、フォームのテキスト フィールドのすぐ横にエラー メッセージを表示する必要があります。

<html>
  <head>
  <script type="text/javascript">
  function validate() {
  if(myform.fname.value.length==0)
  {
   document.getElementById("fname").innerHTML="this is invalid name ";
  }
  }
  </script>
  </head>
  <body>
  <form name="myform">
  First_Name
  <input type=text id=fname name=fname onblur="validate()"> </input>

  <br> <br>
  Last_Name
  <input type=text id=lname name=lname onblur="validate()"> </input>

  <br>
  <input type=button value=check> 

  </form>
  </body>
</html>
4

11 に答える 11

9

このコードを試してください

<html>
<head>
 <script type="text/javascript">
 function validate() {
  if(myform.fname.value.length==0)
  {
document.getElementById('errfn').innerHTML="this is invalid name";
  }
 }
 </script>
</head>
<body>
 <form name="myform">
  First_Name
  <input type=text id=fname name=fname onblur="validate()"> </input><div id="errfn">   </div>

<br> <br>
Last_Name
<input type=text id=lname name=lname onblur="validate()"> </input>

<br>
<input type=button value=check> 

</form>
</body>
</html>
于 2013-02-05T07:43:49.650 に答える
6

@ReNjITh.Rの回答に同意しますが、テキストボックスのすぐ横にエラーメッセージを表示したい場合。以下のように

ここに画像の説明を入力

<html>
<head>
<script type="text/javascript">
    function validate() 
    {
        if(myform.fname.value.length==0)
        {
           document.getElementById('errfn').innerHTML="this is invalid name";
        }
    }
</script>
</head>
<body>
    <form name="myform">
         First_Name
         <input type=text id=fname name=fname onblur="validate()" /><span id="errfn"></span>
        <br> <br>
         Last_Name
         <input type=text id=lname name=lname onblur="validate()"/><br>
         <input type=button value=check /> 
    </form>
</body>

于 2013-02-05T08:17:16.413 に答える
5

ウェブマスターまたはウェブプログラマーは、挿入してください

<!DOCTYPE html>

あなたのページの最初に。次に、属性を次のように引用符で囲む必要があります

type="text" id="fname"

input要素には end 要素を含めないでください。次のように閉じてください。

 />

input 要素 dont have innerHTML、持っているvalueので、javascript行は次のようになります。

document.getElementById("fname").value = "this is invalid name";

整理された方法で書き、標準に便利であることを確認してください。

于 2013-02-05T07:41:07.203 に答える
2

このように試すことができます

 <html>
          <head>
          <script type="text/javascript">
          function validate() 
          {
            var fnameval=document.getElementById("fname").value;
            var fnamelen=Number(fnameval.length);
               if(fnamelen==0)
               {
                  document.getElementById("fname_msg").innerHTML="this is invalid name ";
                }
            }
          </script>
          </head>
          <body>
          <form name="myform">
          First_Name
          <input type=text id=fname name=fname onblur="validate()"> </input>
           <span id=fname_msg></span>
          <br> <br>
          Last_Name
          <input type=text id=lname name=lname onblur="validate()"> </input>

          <br>
          <input type=button value=check> 

          </form>
          </body>
        </html>
于 2013-02-05T07:30:12.957 に答える
1

これを試すこともできます

<tr>
    <th>Name :</th>
    <td><input type="text" name="name" id="name" placeholder="Enter Your Name"><div id="name_error"></div></td>
</tr>



    function register_validate()
{
    var name = document.getElementById('name').value;
    submit = true;
    if(name == '')
    {
        document.getElementById('name_error').innerHTML = "Name Is Required";
        return false;
    }
    return submit;
}
document.getElementById('name').onkeyup = removewarning;
function removewarning()
{
    document.getElementById(this.id +'_error').innerHTML = "";
}
于 2016-10-13T06:57:55.677 に答える
0

入力値の innerHtml を設定しても、ここでは何もうまくいきません。スパンなどの他の要素で試すか、以前に作成された非表示のエラー メッセージを表示するだけです。名前フィールドの値を設定できます。

<head>
    <script type="text/javascript">
        function validate() {
            if (myform.fname.value.length == 0) {
                document.getElementById("fname").value = "this is invalid name ";
                document.getElementById("errorMessage").style.display = "block";
            }
        }
    </script>
</head>

<body>
    <form name="myform">First_Name
        <input type="text" id="fname" name="fname" onblur="validate()"></input> <span id="errorMessage" style="display:none;">name field must not be empty</span>

        <br>
        <br>Last_Name
        <input type="text" id="lname" name="lname" onblur="validate()"></input>
        <br>
        <input type="button" value="check" />
    </form>
</body>

フィドル

于 2013-02-05T07:36:22.297 に答える
0

Try like this:

function validate(el, status){
     var targetVal = document.getElementById(el).value;
     var statusEl = document.getElementById(status);
     if(targetVal.length > 0){
        statusEl.innerHTML = '';
  }
     else{
        statusEL.innerHTML = "Invalid Name";
   }
}

Now HTML:

<!doctype html>
<html lang='en'>
<head>
<title>Derp...</title>
</head>
<body>
<form name="myform">
  First_Name
  <input type="text" id="fname" name="fname" onblur="validate('fname','fnameStatus')">
  <br />
  <span id="fnameStatus"></span>
  <br />
  Last_Name
  <input type="text" id="lname" name="lname" onblur="validate('lname','lnameStatus')"> 
  <br />
  <span id="lnameStatus"></span>
  <br />
  <input type=button value=check> 
</form>
</body>
</html>
于 2013-02-05T07:53:48.710 に答える
0

入力タイプのフォーム要素であるため、.innerHTML ではなく .value を使用する必要があります。

<html>
  <head>
  <script type="text/javascript">
  function validate() {
  if(myform.fname.value.length==0)
  {
   document.getElementById("fname").value="this is invalid name ";
  }
  }
  </script>
  </head>
  <body>
  <form name="myform">
  First_Name
  <input type=text id=fname name=fname onblur="validate()"> </input>

  <br> <br>
  Last_Name
  <input type=text id=lname name=lname onblur="validate()"> </input>

  <br>
  <input type=button value=check> 

  </form>
  </body>
</html>
于 2013-02-05T07:57:46.237 に答える
0

まず、入力フィールドの innerHTML に書き込もうとしています。これは機能しません。書き込み先の div または span が必要です。次のようなものを試してください：

First_Name
<input type=text id=fname name=fname onblur="validate()"> </input>
<div id="fname_error"></div>

次に、検証関数を読み取りに変更します

if(myform.fname.value.length==0)
    {
    document.getElementById("fname_error").innerHTML="this is invalid name ";
    }

第二に、私は常に onBlur をこの種のものに使用することをためらっています。フィールドを終了せずにフォームを送信することは可能です (例: リターン キー)。その場合、検証コードは実行されません。フォームを送信するボタンから検証を実行し、ドキュメントが検証に合格した場合にのみ、関数内から submit() を呼び出すことを好みます。

于 2013-02-05T07:41:09.373 に答える
0

これを試して

<html>
  <head>
  <script type="text/javascript">
  function validate() {
  if(myform.fname.value.length==0)
  {
   document.getElementById("error").innerHTML="this is invalid name ";
   document.myform.fname.value="";
   document.myform.fname.focus();
  }
  }
  </script>
  </head>
  <body>
  <form name="myform">
  First_Name
  <input type="text" id="fname" name="fname" onblur="validate()"> </input>
<span style="color:red;" id="error" > </span>
  <br> <br>
  Last_Name
  <input type="text" id="lname" name="lname" onblur="validate()"> </input>

  <br>
  <input type=button value=check> 

  </form>
  </body>
</html>
于 2013-02-05T08:02:48.367 に答える