Question

在我放入fadeOut函数后删除一个完整的li不起作用。单击span（x）之后它应该删除li但是在我输入fadeOut函数之后它不起作用。

//Check off specific Todos By Clickin
$("li").click(function(){
    $(this).toggleClass("completed");
});

//Click on X to delete Todo
$("span").click(function(event){
    $(this).parent().fadeOut(500,function(){
        $(this).remove();
    });
    event.stopPropagation();
});

#container {
    width:360px;
    margin:0 auto;
    border:2px solid grey;
}

.completed {
    color:gray;
    text-decoration: line-through;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
    <title>Todo List</title>
    <link rel="stylesheet" type="text/css" href="assets/css/todos.css">
    <script type="text/javascript" src="assets/js/lib/jquery-3.3.1.slim.js"></script>

</head>
<body>

    <div id="container">
        <h1>To-Do List</h1>
        <input type="text">

        <ul>
            <li><span>X</span> Go to Potions Class</li>
            <li><span>X</span> Buy New Robes</li>
            <li><span>X</span> Visit hermione</li>
        </ul>
    </div>

    <script type="text/javascript" src="assets/js/todos.js"></script>
</body>
</html>

使用范围删除整个li不起作用

0 个答案: