Javascript 在动态创建的表单中添加和删除输入元素

我有一个“消息”页面，可以对每条消息进行评论。我正在做一个类似facebook的文本区，当你聚焦时，它会显示提交按钮，当你点击模糊时，它会再次隐藏。到目前为止，我尝试了一些不同的方法：

<script type="text/javascript">
function focusTextarea(id) {
        var form = document.forms[id];

       //Create an input type dynamically.
        var element = document.createElement("input");

        //Assign different attributes to the element.
        element.setAttribute("type", "submit");0
        element.setAttribute("value", "Post comment");
        element.setAttribute("name", "createComment");
        element.setAttribute("class", "okButton");
        element.setAttribute("id", "test");

        var foo = document.getElementById("commentButton");

        //Append the element in page (in span).
        form.appendChild(element);

}

function unFocusTextarea(id) {
    var test = document.getElementById(id);

    var foo = document.getElementById("commentButton");
    var foo2 = document.getElementById("test");

    foo.removeChild(foo2);
}
</script>

函数focusTextarea（id）{
var form=document.forms[id]；
//动态创建输入类型。
var元素=document.createElement（“输入”）；
//为元素指定不同的属性。
element.setAttribute（“类型”、“提交”）；0
setAttribute（“值”、“后注释”）；
setAttribute（“name”、“createComment”）；
setAttribute（“类”、“ok按钮”）；
setAttribute（“id”、“test”）；
var foo=document.getElementById（“commentButton”）；
//在页面中追加元素（在span中）。
形式.appendChild（元素）；
}
函数unFocusTextarea（id）{
var test=document.getElementById（id）；
var foo=document.getElementById（“commentButton”）；
var foo2=document.getElementById（“测试”）；
foo.removeChild（foo2）；
}

参数id是表单名称和id。在第一个函数中，我想找到表单并插入一个提交按钮。第二个函数我想再次找到表单并删除按钮

---

提前谢谢

我不明白你想说什么

document.getElementById("commentButton");

但是，这应该是一种简单的方法：

function unFocusTextarea(id) {
var form = document.getElementById(id);
if(form.lastChild.name=="createComment")form.removeChild(form.lastChild)
}

---

由于按钮（如果存在）始终是表单的最后一个子项，因此它只查看该最后一个子项，并检查名称属性是否与给定值（createComment）匹配。如果有，按钮将被删除。

对于您不应该创建和删除对象的操作，您只需使用CSS隐藏对象即可。当需要隐藏DOM元素及其所有子元素时，将其

.style.display

属性设置为

“none”

，当需要显示它们时，将其设置为

”

---

至于您当前的代码，我认为document.forms并不像您认为的那样。表单不是作用域，它是DOM元素，最好像其他元素一样引用它：

document.getElementById（“formid”）

最终使用jquery：

function focusTextarea(id) {
    if($("#"+id+" #comment_"+id).val() == "Write a comment..") {
        $("#"+id+" #comment_"+id).val("");
        $("#"+id+" #commentTools_"+id).append("<input type='checkbox' name='createPrivate' value='1'> <span class='normal'>Private</span><br><input type='submit' name='createSubmit' value='Post comment' class='okButton'>");
        $("#"+id+" #comment_"+id).rows = 5;
    }
}

function unFocusTextarea(id) {
    if($("#"+id+" #comment_"+id).val() == "Write a comment.." || $("#"+id+" #comment_"+id).val() == "") {
        $("#"+id+" #commentTools_"+id).empty();
        $("#"+id+" #comment_"+id).val("Write a comment..");
    }
}

功能焦点区域（id）{
if（$（“#”+id+“#注释#”+id）.val（）=“写注释…”）{
$（“#”+id+“#注释”+id）.val（“”）；
$（“#”+id+“#注释工具"+id）.append（“Private
”）；
$（“#”+id+“#注释”+id）；
}
}
函数unFocusTextarea（id）{
if（$（“#”+id+“#注释"+id）.val（）=”写注释..“| |$”（“#”+id+“#注释"+id）.val（）=”）{
$（“#”+id+“#commentTools#”+id）.empty（）；
$（“#”+id+“#注释”+id）.val（“写注释…”）；
}
}

---

无论如何谢谢：）

那有什么问题吗？任何特定的错误消息？元素的id在页面上必须是唯一的。在执行form.appendChil。。。。它只是说形式不是函数。无法真正找到窗体的范围。看起来不错，但我仍然需要一种方法以正确的形式插入元素。