使用JavaScript更改輸入標記的表單驗證

Question

我需要使用JavaScript驗證表單。由於我使用字段名稱表中的數據來打印每個字段（如姓名，地址，電話號碼），因此表單保留更改。我正在使用循環打印字段和相應文本輸入標籤的標籤。 （例如名稱：輸入名稱的文本框，輸入電話號碼的文本框：輸入電話號碼的文本框）。最後在提交表單並進入詳細信息表時將這些值存入數組中。

以下是打印每個字段和文本框代碼：

while ($row=mysql_fetch_array($result)){ 
    echo'<labelfor='.$row['field_name'].'name=field_id>'.$row['field_name'].':</label>';       
    echo'<inputtype="text" name=field_name[]id="'.$row['field_id'].'":value="'.$row['field_value'].'" size="20" class = "inpBox" >'; 
} 

現在，我需要檢查這些字段是否爲空使用JavaScript，然後更改特定文本框的樣式。任何幫助將不勝感激。

Answer 1

你會想要鉤住表單的提交事件。然後，你可以這樣做：

這是jQuery的：

$("form").submit(function{ 
    $('input[type="text"]',"form").each(function(){ 
     var $me = $(this); 
     var status = true; 
     if($me.val() == ""){ 
      $me.addClass("input-validation-error"); 
      status = false; 
     } 
     //Return status. True=Form is valid, False=Form is NOT valid 
     return status; 
    }); 
}); 

你可以在這裏閱讀更多：http://api.jquery.com/submit/

要獲取JavaScript中的值，你可以這樣做：

var inputs = document.getElementsByTagName("input"); 
for (var i = 0; i < inputs.length; i++) { 
    var me = inputs[i]; 
    if(me.value == "") { 
     me.className = "input-validation-error"; 
    } 
}​ 

Answer 2

一般谷歌的「動態表單驗證」

您的特定情況下，你會有興趣 見https://developer.mozilla.org/en/DOM/document.getElementsByClassName 和遍歷所有元素。您可能需要爲輸入字段添加額外的屬性來定義是否需要驗證以及所需驗證的類型。