2013-07-11 31 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