jquery detect enter key on dynamically created textbox

Question

I have the following code that creates a textbox:

$(".vocab-list").append( $('<li style="margin-left: 307px;" class="vocab-word" id="vocab_' + vocabWords[wordId]['id']+ '"><img width="230px" height="230px" src="' + vocabWords[wordId]['imageURL'] + '" /><div><input type="text" spellcheck="false" id="writeWord" autocorrect="off" maxlength="200" style="width: 230px;border: 0;border-bottom: 1px solid #C8C6C6;border-radius: 0;color:#6e572f;font-size:24px;font-weight:500;"></div></li>').hide().fadeIn(600));

How Can I detect the enter key? The following didn't work

$('#writeWord').bind("enterKey",function(e){
alert("Enter");
});

possible duplicate of [Javascript capture key](http://stackoverflow.com/questions/756786/javascript-capture-key) — John Conde, Dec 23 '14 at 00:33
`writeWord` isn't a standard HTML tag, do you mean `.writeWord`? Couldn't see `.writeWord` element when you created textbox — Neverever, Dec 23 '14 at 00:34
I meant #writeWord ... i just need to detect the enter key from a dyanmically created textbox — Jake, Dec 23 '14 at 00:48
You might be interested in "Map [Enter] key to work like [Tab] key" http://stackoverflow.com/a/27545387/1500195 — 6ft Dan, Dec 23 '14 at 05:14

score 1 · Accepted Answer · answered Dec 23 '14 at 01:04

1

Use .on for dynamic HTML - detect a keyup event and then detect if the key up was for the enter key:

$(".vocab-list").on("keyup", "#writeWord", function(e) {
    if (e.which == 13) {
        alert("Enter");
    }
});

answered Dec 23 '14 at 01:04

tymeJV

103,943
14
161
157

jquery detect enter key on dynamically created textbox

1 Answers1