表單驗證（JavaScript），不確定爲什麼它不起作用。（沒有錯誤，但消息框沒有出現）

基本上，我試圖添加一個表單到我的網站，當確認/提交按鈕被點擊時，程序檢查名稱&電子郵件表格是否正確信息，否則會顯示警告。表單驗證（JavaScript），不確定爲什麼它不起作用。（沒有錯誤，但消息框沒有出現）

<script language="javascript" type="text/javascript"> 
function validateForm() 
{ 
var x=document.forms["form1"]["name"].value; 
if (x==null || x=="") 
    { 
    alert("Please enter your name"); 
    return false; 
    } 
} 
function validateForm() 
{ 
var x=document.forms["form1"]["e-mail"].value; 
var atpos=x.indexOf("@"); 
var dotpos=x.lastIndexOf("."); 
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length) 
    { 
    alert("Please enter your e-mail address"); 
    return false; 
    } 
} 
</script> 
</head> 
<body> 

    <h2>Form</h2> 
    <p>Note: Please fill in the following fields below, thank you.</p> 
    <form id="form1" name="form1" method="post" action="post"> 
     <p> 
     <label for="name">Name:</label> 
     <br /> 
     <input type="text" name="name" id="name" /> 
     </p> 
     <p> 
     <label for="e-mail">E-mail:</label> 
     <br /> 
<input type="text" name="e-mail" id="e-mail" /> 
     </p> 
     <p> 
     <label for="msg">Message:</label> 
     </p> 
     <p> 
     <textarea name="msg" id="msg" cols="45" rows="5"></textarea> 
     </p> 
     <p> 
     <input type="button" name="Confirm" id="Confirm" value="Submit" /> 
     </p> 
     <!-- end .content --> 
    </form> 
    </div> 
    <div class="sidebar2"> 
    <h4>&nbsp;</h4> 
    <p>&nbsp;</p> 
    <p><!-- end .sidebar2 --></p> 
    </div> 
    <div class="footer"> <img src="pics/copyright.gif" width="960" height="100" alt="footer" /></div> 

<!-- end .container --></div> 
</body> 
</html>

來源

2013-05-15 Boats

我必須補充，我不知道如何發佈我的代碼，因爲它不斷地說我做某某它，再加上我沒有張貼圖片，因爲我沒有足夠的代表。 – Boats

艱難的打破兄弟。太糟糕了，你根本沒有提供任何信息，否則我們可能會提供幫助。 – PlantTheIdea

你可以發表一些代碼 – user1

在您的代碼：

> <script language="javascript" type="text/javascript">

語言屬性已棄用了大約15年，type屬性不再是必需的，因此：

<script> 

> function validateForm() { 
>  var x=document.forms["form1"]["name"].value;

這是很方便的傳遞引用從監聽器到表單，所以函數可以更通用。另外，命名錶單控件被添加爲表單的命名屬性。如果您的控件的名稱與表單屬性相同，則它將覆蓋表單屬性，因此您無法將其作爲屬性進行訪問。更好的避免了元素的名稱和標識的標準屬性名稱，所以：

function validateForm(form) { 
    var x = form.userName.value

則：

>  if (x == null || x == "") {

表單控件的值是一個字符串，所以x == null永遠不會爲真。這是足夠了（更適合），只是測試：

if (x == "") {

[...]

> function validateForm() {

如果您聲明多個函數具有相同的名稱，每次都會覆蓋前一個，所以你留下只有最後一個。您應該有一個可以執行檢查的驗證功能，儘管每次檢查都可能是一個單獨的功能。

> var x=document.forms["form1"]["e-mail"].value; 
> var atpos=x.indexOf("@"); 
> var dotpos=x.lastIndexOf("."); 
> if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length) 
> { 
> alert("Please enter your e-mail address"); 
> return false; 
> } 
> }

您可以使用正則表達式來檢查電子郵件地址的格式。

> <form id="form1" name="form1" method="post" action="post">

通常不需要表單上的ID和名稱屬性，通常只使用一個ID。對於其他表單控件，需要一個名稱才能成功，因此很少需要他們擁有一個ID。

驗證功能可以從表單的提交事件被調用，所以：

<form id="form1" onsubmit="validateForm(this);" ...>

[...]

>  <input type="text" name="name" id="name" />

不要在HTML文檔中使用的XML標記。並且不要使用與表單屬性名稱相同的元素名稱，因爲它們會使相關表單屬性無法訪問。

</p> 
    <p> 
    <label for="e-mail">E-mail:</label> 
    <br />

消息：

如果這是一個提交按鈕，然後使它鍵入提交。它並不需要一個名字或ID，如果它的值不提交：

<input type="submit" value="Submit">

所以你的形式和代碼可以是：

function validateForm(form) { 
    var reUserName = /\w+/; // User name has some letters 
    var reEmail = /[email protected]+\..+/; // email has some characters, @, then a dot near the end 
    var passed; 

    if (!reUserName.test(form.userName.value)) { 
     passed = false; 
     // show message for user name 
    } 
    if (!reEmail.test(form.eMail.value)) { 
     passed = false; 
     // show message for email 
    } 
    return passed; 
}

注意，電子郵件驗證只是你有什麼，這不是特別徹底。

然後形式：

<form onsubmit="return validateForm(this);"> 
    Name: <input name="userName"><br> 
    E-mail: <input name="eMail"><br> 
    <input type="submit"> 
</form>

來源

2013-05-16 00:23:16 RobG

非常感謝:)這是非常有益的，你穿過每個部分。 – Boats

不幸的是，代碼沒有做任何事情，我的頁面只是刷新並清除所有字段。 – Boats

只是縮進你的代碼，它應該沒問題，我很樂意提供幫助，但沒有看到代碼就沒有多少我可以做的。也許鏈接到您網站上的網頁？

來源

2013-05-15 21:10:41

這是真正的問題之一，我不確定是否縮進它，因爲我做了一些縮進，它繼續說我需要進一步縮進 – Boats

表單驗證（JavaScript），不確定爲什麼它不起作用。 （沒有錯誤，但消息框沒有出現）

回答

相關問題

表單驗證（JavaScript），不確定爲什麼它不起作用。（沒有錯誤，但消息框沒有出現）