我想从点击事件更改为按键事件[重复]答案

【问题标题】：I want to change from a click event to a keypress event [duplicate]我想从点击事件更改为按键事件[重复]
【发布时间】：2014-05-20 05:45:51
【问题描述】：

我创建了一个待办事项列表，并将其设置为在您单击添加按钮时添加项目，但我想将其设置为您可以按 Enter 键的位置，这是我的代码：

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() {
    $("#add").on('keypress' , addListItem);
}

请帮忙

【问题讨论】：

标签： javascript jquery

【解决方案1】：

你可以在你的 addListItem 函数中做这样的事情：

JS：

$(document).keypress(function(e) {
    if(e.which == 13) {
        alert('You pressed enter!');
    }
});

作为你的实现：

function addListItem(event) {
    if(event.which == 13){
        var text = $("#new-text").val();
        $("#todolist").append('<li><input type="checkbox" class="done"/>'+text+'<button                  class="delete">Delete</button></li>');
        $("#new-text").val('');
    }
}

$(function() {
    $("#add").on('keypress' , function(event) { addListItem(event););
}

【讨论】：

$("#add").on('keypress' , addListItem(this)); 错误
现在已经修复了，谢谢：$('#add').on('keypress', function(event) { addListItem(event); });
你甚至不需要这个功能......

【解决方案2】：

试试这个：

function addListItem(event) {
    if(event.which == 13){

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

$(function() {
    $("#add").on('keypress' , addListItem);
}

【讨论】：

【解决方案3】：

检查函数中的keyCode：

function something(event){
  if ( event.keyCode == 13 ) 
    alert( 'ENTER!');
}

【讨论】：

【解决方案4】：

您需要获取您按下的键码并检查它是 ENTER 键。

function addListItem(e) {
    var keycode = (e.keyCode ? e.keyCode : e.which);
    if (keycode == '13') {
        var text = $("#new-text").val();
        $("#todolist").append('<li><input type="checkbox" class="done"/>'+text+'<button                  class="delete">Delete</button></li>');
        $("#new-text").val('');
        $("#new-text").val('');
    }
});

【讨论】：