Jquery 谁能告诉我哪里做错了？_Jquery_Html_Css

Jquery 谁能告诉我哪里做错了？

jquery html css

Jquery 谁能告诉我哪里做错了？,jquery,html,css,Jquery,Html,Css,我正在尝试用HTML、CSS和jQuery制作一个简单的待办事项列表，我面临一个问题，它没有按照我的要求向dos输入中添加新的内容，下面是代码，如果有人能指出我哪里做错了，那就太好了 //HTML 这是HTML标签，对我来说很好 <head> <title>TODO list</title> <link rel="stylesheet" type="text/css" href="assests/css/todos.css"> <link h

我正在尝试用HTML、CSS和jQuery制作一个简单的待办事项列表，我面临一个问题，它没有按照我的要求向dos输入中添加新的内容，下面是代码，如果有人能指出我哪里做错了，那就太好了

//HTML 这是HTML标签，对我来说很好

<head>
<title>TODO list</title>
<link rel="stylesheet" type="text/css" href="assests/css/todos.css">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
<script type="text/javascript" src="assests/js/lib/jquery-3.2.1.min.js"></script>
</head>
<body>
    <div id="container">
        <h1>TO-DO List<i class="fa fa-plus"></i></h1>
        <input type="text" placeholder="Add New Todo">
        <ul>
            <li><span><i class="fa fa-trash"></i></span> Go To Potions Class</li>
            <li><span><i class="fa fa-trash"></i></span> Buy New Robes</li>
        <li><span><i class="fa fa-trash"></i></span> Visit Hogrid</li>
        </ul>
    </div>
<script type="text/javascript" src="assests/js/todos.js"></script>
</body>

//jQuery

这是jquery标签，我正在学习“Web开发者训练营”课程，我必须使用这些代码制作一个待办事项列表，我编写完全相同的代码，但它仍然不起作用，当我想向Dos添加新的内容时，它正在添加但没有显示，它会创建一个空白的li，当我将鼠标悬停在li上时，它会以典型的方式显示出来。 //通过单击检查特定TODO

$("ul").on("click","li",function(){
   $(this).toggleClass("completed");
});
//click on X to delete TODO 


$("ul").on("click","span",function(event){
   //to remove parent lis
   $(this).parent().fadeOut(500,function(){
   $(this).remove();
});
event.stopPropagation();
});

//adding new TODO

$("input[type='text'").keypress(function(event){
   if(event.which===13){
       //grabbing new TODO text from input
    var todoText= $(this).val();
    $(this).val("");
    //create a new li and add to ul
    $("ul").append("<li><span><i class='fa fa-trash'><span> " + todoText    +"</li>")
    }
});

$（“ul”）。在（“单击”，“li”，函数（）上）{
$（此）.toggleClass（“已完成”）；
});
//单击X删除待办事项
$（“ul”）。在（“单击”，“跨距”，功能（事件）{
//删除父lis的步骤
$（this.parent（）.fadeOut（500，function（））{
$（this.remove（）；
});
event.stopPropagation（）；
});
//添加新的待办事项
$（“输入[type='text'））。按键（函数（事件）{
if（event.which==13）{
//从输入抓取新的TODO文本
var todoText=$（this.val（）；
$（此）.val（“”）；
//创建新的li并添加到ul
$（“ul”）。追加（“”+todoText+”）
}
});

输入选择器缺少右括号：

$("input[type='text'")

这只是问题之一。通过关闭OP附加新li元素的span标记，可以实现所需的行为。请参阅提供的JSFIDLE非常感谢，我显然错过了，再次感谢

$("input[type='text'")