用JavaScript按下Enter键时调用函数

Question

我正在使用addEventListener将事件绑定到节点。 addEventListener将addItem函数添加到节点。 但是当我按Enter键时，该功能未运行。

这是JavaScript：

document.getElementById('add-item').addEventListener('keypress', function (e) {
    if (e.keyCode == 13) {
            addItem();
    }
}, false);

function addItem() {
    var list = document.querySelector('ul.todo-list');
    var newItem = document.getElementById('new-item-text').value;
    var newListItem = document.createElement('li');
    newListItem.className = 'todo-item';
    newListItem.innerHTML = newItem + '<span class="remove"></span>';
    list.insertBefore(newListItem, document.querySelector('.todo-new'));

    //1. Empty the Input field once the item 
    document.getElementsByTagName('input')[0].value = '';
}

这是HTML：

<li class='todo-new'>
    <input id='new-item-text' type='text'/>
    <a id='add-item' href='#'>+</a>
</li>

另一方面，该功能通过click运行

document.getElementById('add-item').addEventListener('click', addItem, false);

我只想使用JavaScript而不使用jQuery库。

编辑：我想将事件附加到输入字段。

Answer 1

我敢打赌，当您按Enter键时， add-item元素不会成为焦点。 而是尝试将触发器更改为输入字段。

document.getElementById('new-item-text').addEventListener('keypress', function (e) {
    if (e.keyCode == 13) {
            addItem();
    }
}, false);