Javascript 未添加到购物列表中的项目

我正在尝试创建一个购物列表站点，当用户在表单中键入内容时，它下面会显示一个列表，类似于。我的JavaScript代码如下所示，而我的HTML和CSS位于：

$（文档）.ready（函数（）{
函数addItem（）{
$（“.typehere”）.keyup（函数（事件）{
if（event.which==13）{
displayItem（）；
}
});
}
函数displayItem（）{
var item=$（“.typehere”）.val（）；
风险值工作=“
”+项目+”
完成删除；
$（“.列出的项目”）。预支（工作）；
$（“.typehere”）.val（“”）；
}
});

您处理输入提交的代码不正确：

• 事件处理程序使用未调用的

  addItem

  函数包装
• 未阻止sumbiting的默认行为
• 挂起

  键向上

  而不是

  键向下

  （这对于防止

它至少应该是这样的：

$(document).ready(function()
{
    $(".typehere").keydown(function(event)
    {
        if (event.which == 13)
        {
            event.preventDefault();
            displayItem();
        }
    });

    function displayItem()
    {
        var item = $(".typehere").val();
        var work = '<li><p>' + item + '</p><button>Completed</button>      <button>Remove</button></li>';
        $(".listed-items").prepend(work);
        $(".typehere").val('');
    }
});

$（文档）.ready（函数（）
{
$（“.typehere”）.keydown（函数（事件）
{
if（event.which==13）
{
event.preventDefault（）；
displayItem（）；
}
});
函数displayItem（）
{
var item=$（“.typehere”）.val（）；
风险值工作=“
”+项目+”
已完成删除；
$（“.列出的项目”）。预支（工作）；
$（“.typehere”）.val（“”）；
}
});

---

和。

仅供参考，我尽量在主题行中更具描述性您的代码有什么问题？它没有达到你期望的效果？请发布问题的完整描述和正确的标题，而不是说检查你的代码…在这里，我们不能自由检查每个人的代码。

$(document).ready(function()
{
    $(".typehere").keydown(function(event)
    {
        if (event.which == 13)
        {
            event.preventDefault();
            displayItem();
        }
    });

    function displayItem()
    {
        var item = $(".typehere").val();
        var work = '<li><p>' + item + '</p><button>Completed</button>      <button>Remove</button></li>';
        $(".listed-items").prepend(work);
        $(".typehere").val('');
    }
});