JavaScript表單驗證工作不適合2個輸入字段

Question

我試圖使用JavaScript來驗證我的形式。我想，如果一個用戶離開輸入框爲空，則他會看到一個警告和表單不會提交數據到PHP文件。不幸的是，下面的代碼不適合我。 JavaScript不在表單提交上執行。

的JavaScript

<script> 
function MyForm() { 
var x =document.forms["myForm"]["name"].value; 
    if (x == null || x == "")  {alert("Name must be filled out"); 
    return false; 
    } 
    { var y=document.forms["myForm"]["age"].value; 
if (y == null || y == "") { 
    alert("age must be filled out"); 
    return false; 
    } 
} 

形式

<form name="myForm"action="game.php"onsubmit="return myForm()"method="post"> 



    Name: <input type="text" name="name"> 

Age: <input type="text" name="age"> 
<input type="submit" value="Submit"> 
</form> 

任何幫助是極大的appriciated。

Answer 1

，你必須先調用myForm的功能，使其工作

function MyForm() { 
var x =document.forms["myForm"]["name"].value; 

    if (x == null || x == "") 
     {alert("Name must be filled out"); 
    return false; 
    } 
    var y=document.forms["myForm"]["age"].value; 
if (y == null || y == "") { 
    alert("age must be filled out"); 
    return false; 
    } 
} 
MyForm(); // invoke it here 

Answer 2

你必須在你的代碼一對夫婦的錯別字。找到他們的一個好方法是使用控制檯瀏覽器的開發者工具（嘗試按F12）。

變化

{ var y=document.forms["myForm"]["age"].value; 

到

var y=document.forms["myForm"]["age"].value; //removed the opening curly brace 

，並在您的形式變化：

onsubmit="return myForm()" 

到

onsubmit="return MyForm()" 

Answer 3

在您的javascript方法中有2個錯字問題。請嘗試以下方法

function MyForm() { 
    var x = document.forms["myForm"]["fname"].value; 
    if (x == null || x == "")  { 
     alert("Name must be filled out"); 
     return false; 
    } 
    var y=document.forms["myForm"]["age"].value; 
    if (y == null || y == "") { 
      alert("age must be filled out"); 
      return false; 
    } 
}