Question

我有一个列表，我想在点击按钮时删除第一个列表项

HTML代码

<div id="vakjesdiv">
    <ul>
        <li class="verwijder">
            <img class="aanbieding" src="images/jack.png" /><span id="timer"></span>

        </li>
        <li class="verwijder">
            <img class="aanbieding" src="images/kpn.png" /><span id="timer2"></span>
        </li>
        <li class="verwijder">
            <img class="aanbieding" src="images/mac.png" />
        </li>
        <li class="verwijder">
            <img class="aanbieding" src="images/pathe.png" />
        </li>
    </ul>
</div>
<button id="testbutton">Button</button>

jQuery代码

//AANBIEDING VERWIJDEREN

$("button").click(function () {
    $(".verwijder").remove();
});

我尝试了不同的东西，但我找不到问题。有人能帮帮我吗？：）

由于

Answer 1

您想删除第一个li项，然后您可以使用jquery .eq()：

＆＃13;

$("button").click(function () {
    $(".verwijder").eq(0).remove();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="vakjesdiv">
    <ul>
        <li class="verwijder">
            <img class="aanbieding" src="images/jack.png"><span id="timer"></span>
        </li>
        <li class="verwijder">
            <img class="aanbieding" src="images/kpn.png"> <span id="timer2"></li>
    <li class="verwijder"><img class="aanbieding" src="images/mac.png"></li>
    <li class="verwijder"><img class="aanbieding" src="images/pathe.png"></li>
  </ul>
 </div>

 <button id="testbutton">Button</button>

＆＃13;

Answer 2

试试这个

$("ul .verwijder:first-child").remove();

这将删除符合select语句的第一个子节点。

jQuery first-child选择器：http://api.jquery.com/first-child-selector/

Answer 3

使用$( ".verwijder" ).remove();删除所有列表项。您希望仅使用$( ".verwijder:first-child" ).remove();或$( ".verwijder" ).first().remove();删除每次点击的第一个列表项。

Answer 4

尝试此操作以删除第一个列表项：

 $( ".verwijder" ).first().remove();

Answer 5

简单地：

$("#vakjesdiv .verwijder:first").remove();

使用jQuery删除列表项

5 个答案: