Javascript JQuery输入键

所以我尝试使用JQuery、JavasScript和HTML创建一个待办事项列表。我不知道如何使添加按钮（将任务添加到列表）在按下enter键时也添加。我在网上尝试了很多东西，比如带有（keyCode==13）的if语句等等

我已经附上了我的HTML和JavaScript文件

函数addListItem（）{
var text=$（“#新文本”）.val（）；
$（“#todolist”）.append（“
”+text+“Delete
”）；
$（“#新文本”）.val（“”）；
}
函数deleteItem（）{
if（$（this）.parent（）.css（'textDecoration'）=='line-through'）{
$（this.parent（）.remove（）；
}否则{
$（this.parent（）.remove（）；
}
}
函数finishItem（）{
if（$（this）.parent（）.css（'textDecoration'）=='line-through'）{
$（this.parent（）.css（'textDecoration'，'none'）；
}否则{
$（this.parent（）.css（'textdeaction'，'line-through'）；
}
}
$（函数（）{
$（“#添加”）。在（'单击'，添加列表项）；
$（文档）。在（'click'，'delete'，deleteItem'）；
$（文档）.on（'click'，'.done'，finishItem）；
});

我的页面
待办事项清单

清理房屋删除
购买牛奶删除

添加
尝试以下操作

您没有添加jquery库

我添加了
keyup
事件以添加新按钮


函数addListItem（）{
var text=$（“#新文本”）.val（）；
$（“#todolist”）.append（“
”+text+“Delete
”）；
$（“#新文本”）.val（“”）；
}
函数deleteItem（）{
if（$（this）.parent（）.css（'textDecoration'）=='line-through'）{
$（this.parent（）.remove（）；
}否则{
$（this.parent（）.remove（）；
}
}
函数finishItem（）{
if（$（this）.parent（）.css（'textDecoration'）=='line-through'）{
$（this.parent（）.css（'textDecoration'，'none'）；
}否则{
$（this.parent（）.css（'textdeaction'，'line-through'）；
}
}
$（函数（）{
$（“#添加”）。在（'单击'，添加列表项）；
$（文档）。在（'click'，'delete'，deleteItem'）；
$（文档）.on（'click'，'.done'，finishItem）；
});
$（文档）.on（'keyup'，'#new text'，函数（e）{
如果（e.which==13）{
addListItem（）；
}
})

我的页面
待办事项清单

清理房屋删除
购买牛奶删除

添加
1.添加jQuery库（代码中缺少该库）

2.在
文本框中添加
keydown
事件监听器，并选中enter键是否按下？如果是，则调用
addListItem（）
函数

只需在
$（function（）{..}）中添加以下代码即可

工作片段：-


函数addListItem（）{
var text=$（“#新文本”）.val（）；
$（“#todolist”）.append（“
”+text+“Delete
”）；
$（“#新文本”）.val（“”）；
}
函数deleteItem（）{
if（$（this）.parent（）.css（'textDecoration'）=='line-through'）{
$（this.parent（）.remove（）；
}否则{
$（this.parent（）.remove（）；
}
}
函数finishItem（）{
if（$（this）.parent（）.css（'textDecoration'）=='line-through'）{
$（this.parent（）.css（'textDecoration'，'none'）；
}否则{
$（this.parent（）.css（'textdeaction'，'line-through'）；
}
}
$（函数（）{
$（'input[type=text]'）。向下键（函数（e）{
如果（如keyCode===13）{
addListItem（）；
}  
});
$（“#添加”）。在（'单击'，添加列表项）；
$（文档）。在（'click'，'delete'，deleteItem'）；
$（文档）.on（'click'，'.done'，finishItem）；
});

我的页面
待办事项清单

清理房屋删除
购买牛奶删除

添加
函数addListItem（）{
var text=$（“#新文本”）.val（）；
$（“#todolist”）.append（“
”+text+“Delete
”）；
$（“#新文本”）.val（“”）；
}
函数deleteItem（）{
if（$（this）.parent（）.css（'textDecoration'）=='line-through'）{
$（this.parent（）.remove（）；
}否则{
$（this.parent（）.remove（）；
}
}
函数finishItem（）{
if（$（this）.parent（）.css（'textDecoration'）=='line-through'）{
$（this.parent（）.css（'textDecoration'，'none'）；
}否则{
$（this.parent（）.css（'textdeaction'，'line-through'）；
}
}
函数onKeyUp（事件）{
如果（event.keyCode===13）{
addListItem（）
}
}
$（函数（）{
$（“#添加”）。在（'单击'，添加列表项）；
$（文档）。在（'click'，'delete'，deleteItem'）；
$（文档）.on（'click'，'.done'，finishItem）；
$（“#新文本”）.on（'keyup'，onKeyUp）
});
顶部是Javascript，底部是HTML。谢谢您可以使用
表单
标记和
按钮
，然后
输入
将发布
表单
，您可以使用
jQuery
控制
提交
事件（如果您喜欢使用ajax向服务器提交数据）@CTestPython很高兴为您提供帮助。请别忘了标出应该有效的答案。还可以将新输入包装在表单中并捕获表单提交，因为按Enter键已经是提交表单的一部分（不重新发明轮子的概念）标记了答案。再次感谢。我有一个问题。Jquery库不是已经添加了行吗？@CTestPython这是您的本地设置。我必须添加以运行代码。如果有，请移除另一个
$('#new-text').keydown(function(e){
  if(e.keyCode === 13){
    addListItem();
  }  
});

function addListItem(){

    var text = $("#new-text").val();
    $("#todolist").append('<li><input type="checkbox" class="done" /> '+text+'  <button class="delete">Delete</button></li>');
    $("#new-text").val(' ');

}


function deleteItem(){

    if($(this).parent().css('textDecoration') == 'line-through' ) {
        $(this).parent().remove();
    }else{
        $(this).parent().remove();
    }
}


function finishItem(){
    if($(this).parent().css('textDecoration') == 'line-through' ) {
        $(this).parent().css('textDecoration', 'none');
    }else{
        $(this).parent().css('textDecoration', 'line-through');
    }

}

function onKeyUp(event) {
    if (event.keyCode === 13) {
        addListItem()
    }
}

$(function()  {
    $("#add").on('click', addListItem);
    $(document).on('click', '.delete', deleteItem);
    $(document).on('click', '.done', finishItem);
    $('#new-text').on('keyup', onKeyUp)
});