Javascript - 使用數組遍歷字段？

-1

我有一個表單，並希望驗證它包含的幾個字段是否有條目。Javascript - 使用數組遍歷字段？

因此我有以下幾點：

 var requiredFields = array(
           'Delivery_first_name', 
           'Delivery_last_name', 
           'Delivery_address', 
           'Delivery_city', 
           'Delivery_zip', 
           'Delivery_phone' 
     ); 
     for(var field in requiredFields) 
     { 
      if(document.ezpay.field.value.length == 0) 
      { 
       document.ezpay.field.style.cssText = 'background:red;'; 
      } 
     }

然而，它似乎並不奏效。我的想法是的if(document.ezpay.field.value.length == 0)的field部分「不被評估。

換句話說，該語句正在執行爲if(document.ezpay.field.value.length == 0)，而不是if(document.ezpay.Delivery_first_name.value.length == 0).

任何人都可以證實這一信念更重要的是給我一些指導，爲什麼上面不工作？

的上述目標是通過定義的字段進行迭代，並設置CSS樣式背景爲紅色是空的字段。

謝謝！:)

來源

2011-05-19 Daemon of Chaos

你應該真的可能使用現成的表格驗證插件 – 2011-05-19 20:29:32

我真的認爲你應該試圖理解j avascript *之前*編程。數組聲明是錯誤的。循環是錯誤的。你應用風格的方式是錯誤的。請找到一個不錯的js手冊並完成。 – KooiInc 2011-05-19 20:29:52

嘗試：https：//developer.mozilla。org/en/JavaScript/A_re-introduction_to_JavaScript – KooiInc 2011-05-19 20:36:04

首先，你不應該迭代數組使用for...in作爲該構造是枚舉對象的屬性。

其次，當您想要訪問其名稱包含在名爲field的變量中的屬性時，您試圖訪問名爲field的屬性。嘗試：

for (var i = 0, j = requiredFields.length; i < j; i++) 
{ 
    if (document.ezpay[requiredFields[i]].value.length == 0) 
    { 
     document.ezpay[requiredFields[i]].style.cssText = 'background:red;'; 
    } 
}

來源

2011-05-19 20:25:56 NickFitz

謝謝你的澄清。這正是我所需要的。 – 2011-05-20 19:57:47

只需設置你的輸入字段具有相同的名稱& ID屬性及用途：

if(document.getElementById(field).value.length == 0) 
{ 
    document.getElementById(field).style.cssText = 'background:red;'; 
}

來源

2011-05-19 20:23:20 stevecomrie

可能：

document.ezpay[field].value.length

我不使用時，請務必JS會評估你的field串點符號。

來源

2011-05-19 20:25:24

-1

Uhmm ...嘗試分配屬性「ID」的領域

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

那麼你可以使用

for(var field in requiredFields){ 
    var elem = document.getElementById(field); 
    if(elem.value == '') { 
     //your proccess 
    } 
}

或者你可以嘗試使用jQuery和JQuery驗證？是更容易和可定製..

來源

2011-05-19 20:25:29 jfrubiom

如果沒有JQuery，人們會怎麼想？實際上，爲了實現四行代碼，加載整個庫是不值得的。 – NickFitz 2011-05-19 20:27:55

取決於任務...一些任務是更好的作品與簡單的JavaScript ...和其他更容易使用像jquery框架... – jfrubiom 2011-05-19 20:31:37

NickFitz當時的想法是

這裏是我會怎麼做純JS

var requiredFields = ['Delivery_first_name', 
         'Delivery_last_name', 
         'Delivery_address', 
         'Delivery_city', 
         'Delivery_zip', 
         'Delivery_phone']; 

function validate(theForm) {  
    for(var i=0,n=requiredFields.length;i<n;i++) { 
    var field = theForm[requiredFields[i]]; 
    if (field.value.length == 0) { 
     field.style.backgroundColor ="red"; 
     return false; 
    } 
    else field.style.backgroundColor ="white"; 
    } 
    return true; // allow submit 
} 
window.onload=function(){ 
    document.forms[0].onsubmit=function() { return validate(this);} 
}

如果希望所有空字段變紅做到這一點

function validate(theForm) { 
    var isOk = true; 
    for(var i=0,n=requiredFields.length;i<n;i++) { 
    var field = theForm[requiredFields[i]]; 
    if (field.value.length == 0) { 
     field.style.backgroundColor ="red"; 
     isOk=false; 
    } 
    else field.style.backgroundColor ="white"; 
    } 
    return isOk; // allow or disallow submit 
}

來源

2011-05-19 20:38:18 mplungjan

感謝您提供額外的代碼並展示還有什麼可以做的。 – 2011-05-20 19:58:27

Javascript - 使用數組遍歷字段？

回答

相關問題