如何使用javascript访问表单元素而不使用元素的id

Question

我想使用javascript访问表单元素。表单是动态生成的，因此表单的名称，id和元素是可变的。我希望通过提供由不同脚本生成的表单名称来获取其中textarea的id值。

例如：

<form method=post name=form33>
    <textarea id=466 cols=50 rows=5></textarea>
    <input name=submit33 onclick=postCmnt(33) value=Post type=button>
</form>

我的表单名称为“form33”，我需要textarea id为466作为输出...

生成表单的Javascript：

function openComment(id, msgid, div) {
    var div = document.getElementById(div);
    div.innerHTML = "<form method=post name=form"+id+">
        <textarea id="+msgid+" cols=50 rows=5></textarea>
        <input name=submit"+id+" onclick=postCmnt("+id+") value=Post type=button>
        </form>"
}

需要访问表单的Javascript

我尝试通过提供表单名称来访问id textarea名称。

function postCmnt(id){
    var msgid=document.forms["form"+id].elements[0].id.value;//the text area's id
    var msg=document.getElementById(msgid).value;//value of text area
    //rest scripts goes here        
} 

信息：

1. 通过调用函数openComment（）
生成的表单不是静态的
2. 预测页面中的表单数量是不可能的，因为它取决于用户输入。尽管textarea是表单的第一个元素。

Answer 1

您可以添加包含msgid的隐藏字段：

Javascript生成表单：

function openComment(id,msgid,div){
    var div = document.getElementById(div);
    div.innerHTML="<form method=post name=form"+id+">
        <input type='hidden' id='theid"+id+"' value='"+msgid+"'>
        <textarea id="+msgid+" cols=50 rows=5></textarea>
        <input name=submit"+id+" onclick=postCmnt("+id+") value=Post type=button>
        </form>"
}

然后直接获取值：

function postCmnt(id){
    var msgid=document.getElementById("theid"+id).value;//the text area's id
    var msg=document.getElementById(msgid).value;//value of text area
    //rest scripts goes here        
} 

Answer 2

如果文档中只有一个表单，则可以执行

   document.forms[0]

Answer 3

如指出你可以使用

 document.getElementById("teller")[i]

访问带有“teller”的表单的第i个字段。

Demo