Question

如果我有以下内容：

<div id="test1"></div>
<div id="test2"></div>
<div id="test3"></div>
<div id="test4"></div>

<input type="submit" value="Submit" />

点击提交按钮后如何删除（div test1和test3）？

Answer 1

试试这个：

var button = document.querySelector('input[type="submit"]');
button.onclick = function(event) {
    event.preventDefault();
    var ids = ['test1','test3'];
    var count = ids.length;
    while(count--) {
        document.getElementById(ids[count]).remove();
    }
};

<div id="test1">test1</div>
<div id="test2">test2</div>
<div id="test3">test3</div>
<div id="test4">test4</div>

<input type="submit" value="Submit" />

Answer 2

使用jQuery，你应该有类似jsFiddle的东西：

$(document).ready(function(){
    $('#submit-btn').click(function(e){
        e.preventDefault();
        $('#test1, #test3').remove();
    })
});

Answer 3

你可以尝试使用JQuery hide accordian，这是一个例子：

把它放在你的头标记中：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("#hide").click(function(){
        $("#1, #3").hide();
    });
    $("#show").click(function(){
        $("#1, #3").show();
    });
});
</script>

这是你的身体标签：

<div id="1">If you click on the "Hide" button, I will disappear.</div>
<div id="2">If you click on the "Hide" button, I will disappear.</div>
<div id="3">If you click on the "Hide" button, I will disappear.</div>
<div id="4">If you click on the "Hide" button, I will disappear.</div>

<button id="hide">Hide</button>
<button id="show">Show</button>

按钮单击时删除特定行

3 个答案: