2013-07-11 32 views
0

有沒有一種方法可以使用具有required屬性的表單字段來填充JavaScript數組?用所需的表單字段填充JavaScript數組

我試過這段代碼...

var requiredfields = new Array(); 

function getInputs() { 
    var fields = document.getElementsByTagName('input'); 
    for (var i = 0; i < fields.length; i++) { 
     alert('I am input field ' + i); 
     //var required = fields[i].getAttribute('required'); 
     if (fields[i].getAttribute('required')) { 
      fields[i].style.border = '1px solid #ff0000'; 
      requiredfields.push(fields[i]); 
     } 
    } 
} 

不幸的是,它甚至沒有把邊框或顯示警報。我不確定getElementsByTagName是否正確返回數據。

我的代碼很可能是怪人。呵呵呵......

+1

b訂單僅用於測試目的。我無法使用CSS來填充JavaScript數組(請記住問題?)。 – doubleJ

+0

對於愛...我只是意識到,爲什麼我沒有得到警報和東西的原因之一是因爲我的功能在元素呈現之前被調用。我把函數調用放在頁面的末尾,它運行得更好。定位總是值得記住。 – doubleJ

回答

1

你可以使用這個腳本:

http://jsfiddle.net/2u3kZ/

var requiredfields = new Array(); 

var fields = document.getElementsByTagName('input'); 
for (var i = 0; i < fields.length; i++) { 
    if (fields[i].getAttribute("required") != null) { 
     fields[i].style.border = '1px solid #ff0000'; 
     requiredfields.push(fields[i]); 
    } 
} 
+0

感謝'!= null'部分。我不知道如何解決'required',因爲它不是'required ='required''(布爾屬性)。 – doubleJ

+0

有一件事情沒有說明,如果一個字段被標記爲「required」而且「disabled」。表單將忽略'required',但是這個JavaScript仍然是這樣標記的。可以包含更多的邏輯,但是我所做的是爲所有可能被禁用的字段移除'required',並在啓用JavaScript時簡單地添加'required'。 – doubleJ

1

在現代瀏覽器中,你可以這樣做:

var required = document.querySelectorAll('input[required]'); 

Array.prototype.forEach.call(required, function(element){ 
    element.style.border = '1px solid #ff0000'; 
}); 

或者只是使用樣式表中的CSS規則:

input[required] { 
    border: 1px solid #ff0000; 
} 
+0

Safari的iOS版本是否會包含在「現代瀏覽器」中?我必須這樣做的原因是因爲它忽略了'required'和'type =「email」'(或者更具體地說,該字段的格式)。另外,記住問題是關於填充數組(不添加CSS邊框)。 – doubleJ

+0

iOS版本是什麼? 'required'包含您可以循環的僞數組中的所有必需字段。如果你想要真正的數組,只需做'[] .slice.call(必需)'。 – elclanrs

+0

我之前沒有使用'Array.prototype'。我得仔細研究一下。 – doubleJ