Javascript-从动态创建的元素中收集变量

Javascript - Gather variables from dynamic created elements

本文关键字:变量 元素 动态 创建 Javascript-      更新时间:2023-09-26

基本上这是我的javascript 的添加函数

function Add(){
    var newDiv7 = document.createElement("div");
    newDiv7.setAttribute("class","StartDate");
    newDiv7.innerHTML = 'Description: <input type="text" name="Description[]">';
    document.getElementById("container").appendChild(newDiv7);
}

这是我的主要表格

<form name="MainDATA" method="POST" action="Executer.php" onSubmit="validate()">
    <div id="container">
        <div id="cmd">
        <input type="button" value="Add" onclick="Add()">
        <input type="submit" name="submit" value="Submit">
        </div>
    </div>
</form>

验证javascript

function validate(){
    var y = document.forms["MainDATA"]["Description[]"];
    alert(y);
    //validation code
}

只有当用户在我的表单中添加了一个div时,这个代码才能完美地工作。我可以将我的描述转移到y上进行验证,但当用户添加了2个div s时,我的y就变成了undefined。无论用户添加了多少div,我都可以做些什么来收集所有描述?

此外,如果我想检查"y"的长度是否至少为10个字符,我该怎么做才能实现这一点?

提前谢谢。

它似乎工作得很好。

只是计数器变量未定义。

var counter = 0;
function Add() {
    var newDiv7 = document.createElement("div");
    newDiv7.setAttribute("class", "StartDate");
    newDiv7.innerHTML = 'Description: <input type="text" name="Description[]">';
    document.getElementById("container").appendChild(newDiv7);
    document.getElementById("counter").value = counter;
}
function validate() {
    var y = document.forms["MainDATA"]["Description[]"];
    console.log(y);
    //validation code
}

查看FIDDLE 的工作示例

我在Firefox 18上运行了这个程序,并且没有任何问题。你能试试这个小提琴吗

f d()