javascript - 在 DOM 中移除和追加

Question

我已经解决这个问题一段时间了，但我似乎无法弄明白。我有一个复选框，选中后会删除包含文本框的 div。当取消选中该复选框时，上述文本框应返回到页面。删除有效，但附加无效。

这就是我目前正在使用的代码:

$('#ResultsNoData1').click(function () {
    var parent = document.getElementById('Results1').parentNode;
    var child = document.getElementById('Results1');

    if (this.checked) {
        parent.removeChild(child);
    }
    else {
        parent.appendChild(child);
    }
});

我最初的设计是通过执行以下操作实现的:

$('#ResultsNoData1').click(function () {
    (this.checked) ? $('.results1').hide() : $('.results1').show();
});

然而，我需要重新创建的功能实际上是从该文本框中删除数据以防止在网站上被访问，同时隐藏文本框本身。这不提供该功能。

Current example

Answer 1

给你:http://jsfiddle.net/cx96g/5/

你的问题是你试图在你的点击中设置父级，但是一旦子级被移除它就会失败。

var parent = document.getElementById('Results1').parentNode;
var child = document.getElementById('Results1');
$('#ResultsNoData1').click(function () {
    if (this.checked) {
        node = parent.removeChild(child);
    }
    else {
        parent.appendChild(child);
    }
});