按键一次后无法解除按键事件的绑定

Question

我创建了一个输入字段，按下回车键 (13) 时会提交一个简单的字段。如果您第一次按下该键，该代码会起作用，但在我刷新页面之前，该代码将不再起作用。我试图解除该事件的绑定，但没有任何反应。

$(function () {
    $('#new_list').bind('keypress', function (e) {
        if(e.which === 13) {
            console.log('enter pressed');
            var nl_val = {};
            nl_val['list_name'] = $('#new_list').val();
            $.post('/lists/js_new_list',nl_val,function(str) {
                if(str == 'error') {
                    $('#info').css({'color':'red'})
                              .fadeIn(1000)
                              .text('There was an error.')
                              .fadeOut(1000);
                } else {
                    $('#new_list').hide().val('');
                    $('#info').css({'color':'#00620C'})
                              .fadeIn(1000)
                              .text('List created.')
                              .fadeOut(1000);
                    js_refresh_lists(); 
                }
            });
             $('#new_list').unbind("keypress");
        } // UPDATE: this is the if(e.which === 13) end
    });
});

function js_refresh_lists() {
    var id = list_id();
    console.log('refreshing list');
    $('#lists').load('/lists/js_refresh_lists');
}

更新：我希望用户能够添加另一个列表（我的情况），而无需刷新页面以使按键事件再次工作。目前，正如本文顶部提到的，它仅在第一次添加新列表时起作用，之后回车键不起作用。

谁能弄清楚为什么密钥解除绑定吗？

干杯

Answer 1

我认为你的问题是，在第一次成功按键后，你用 js_refresh_lists() 刷新表单，它将你的 #new_list 字段替换为一个新字段，该字段没有按键绑定。

在上述情况下，您有 2 个选择：

1. 将按键初始化放在单独的函数中，并在每次列表刷新时执行它
2. 在加载时使用实时绑定 .live("keypress", fn)