以動態創建的形式添加和刪除輸入元素

Question

我有一個“消息”頁面，可以在每條消息上發表評論。 我正在做一個類似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>

參數id是表單名稱和id。 在第一個功能中，我想查找表單並插入一個提交按鈕。 第二個功能是我想再次查找表單並刪除按鈕。

提前致謝

Answer 1

對於您想做的事情，您不應該創建和刪除對象，只需使用CSS隱藏對象即可。 .style.display DOM元素及其所有子元素隱藏起來， .style.display DOM元素的.style.display屬性設置為"none" ，而如果要顯示它們，則將其設置為"" 。

至於您當前的代碼，我認為document.forms並沒有您認為的那樣。 表單不是范圍，它是DOM元素，最好像其他任何形式一樣引用它： document.getElementById("formid") 。

Answer 2

我看不到你想指出什么

document.getElementById("commentButton");

但是，這應該是一種簡單的方法：

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

由於按鈕（如果存在）始終是表單的lastChild，因此僅查看此lastChild並檢查名稱屬性是否與給定值（createComment）匹配。 如果是這樣，該按鈕將被刪除。

Answer 3

最終改為使用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..");
    }
}

不管怎么說，還是要謝謝你 ：）