2d阵列填充突然停止

时间:2014-08-09 17:09:58

标签: arrays 2d populate

我有一个简单的html,有两个表单,每个表单有四个输入字段:

<!DOCTYPE html>

<html>

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<meta name="viewport" content="initial-scale=1" />
<title>Test3</title>
</head>

<body> 

<h1>Two Forms</h1>

<form id="form1" name="form1" method="post" action="test.php">

    <label for="name">F1 Name*</label>
    <input type="text" name="name" id="name"/>
    <br/>

    <label for="phone">*Phone*</label>
    <input type="text" name="phone" id="phone"/>
    <br/>

    <label for="email">Email</label>
    <input type="text" name="email" id="email"/>
    <br/>

    <label for="postcode">*Postcode</label>
    <input type="text" name="postcode" id="postcode" class="input-textfield"/>
    <br/>

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

</form>
<br/><br/>


<form id="form2" name="form2" method="post" action="test.php">

    <label for="name2">F2 Name*</label>
    <input type="text" name="name2" id="name2"/>
    <br/>

    <label for="phone2">*Phone*</label>
    <input type="text" name="phone2" id="phone2"/>
    <br/>

    <label for="email2">Email</label>
    <input type="text" name="email2" id="email2"/>
    <br/>

    <label for="postcode2">*Postcode</label>
    <input type="text" name="postcode2" id="postcode2" class="input-textfield"/>
    <br/>

    <input type="submit" name="Submit2" value="Submit" />

</form>

<script type="text/javascript" src="check-form.js"></script>

</body>
</html>

我尝试在每个表单之前插入一个段落,并在每个输入字段后面显示一个段落以显示消息:

var nlForms = []; var arPForSubmitMsg = []; // 1d arrays for forms.

var arNlInputs = new Array([]); // 2d arrays for inputs.
var darSpanForErrorMsg = new Array([]); // 2d arrays for inputs.

window.onload = initialise;

function initialise() {

// for creating and inputing paragraph and span elements for displaying submit and error messages.
nlForms = document.getElementsByTagName('form');    
for (f = 0; f < nlForms.length; f++) {
    arNlInputs[f] = nlForms[f].getElementsByTagName("input"); // store list into array makeing it double.
}

// create paragraph elements of class 'submitmsg'and insert them before each form.
for (f = 0; f < nlForms.length; f++) {
    arPForSubmitMsg[f] = document.createElement('p');
    arPForSubmitMsg[f].setAttribute('class', 'submitmsg');
    arPForSubmitMsg[f].innerHTML = "hello form " + f;
    var nodeFormParent = nlForms[f].parentNode;
    nodeFormParent.insertBefore(arPForSubmitMsg[f], nlForms[f]);
}

// create span elements of class 'errormsg' and
// insert them after each input which is required or needs to be validated.     

for (f = 0; f < nlForms.length; f++) {

    for (i=0; i < arNlInputs[f].length; i++) {

// STOP - here it stops when f=1 and i=0 (it does get inside this for loop)

        darSpanForErrorMsg[f][i] = document.createElement("span");

// but it doesn't get to this point when f=1 and i=0;

        darSpanForErrorMsg[f][i].innerHTML = "hello span " + i;
        darSpanForErrorMsg[f][i].class = "errormsg";

        var nodeInputParent = arNlInputs[f][i].parentNode;
        var nodeInputNextSibling = arNlInputs[f][i].nextSibling ;
        nodeInputParent.insertBefore(darSpanForErrorMsg[f][i], nodeInputNextSibling);

    }
}


} // end initialise().

第一个表单的字段填充得很好,但不适用于第二个表单。我检查过,当代码进入第二个for循环时代码停止,当f = 1且i = 0时再次开始迭代。我受到了保护,无法解决我在这里发生的事情。我将不胜感激任何帮助或建议。

1 个答案:

答案 0 :(得分:0)

我想出来(经过漫长的一夜):-):

即使2D数组声明为2D(使用= array([]);),仍然需要将数组中的每个元素声明为数组以使其成为2D。因此,缺少的代码行是:

darSpanForErrorMsg[f] = [];

它应该放在第一个for循环中的第一行。初学者错误;我希望它会帮助其他人坚持下去。