Jake
Jake

Reputation: 3486

jquery detect enter key on dynamically created textbox

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");
});

Upvotes: 1

Views: 1861

Answers (1)

tymeJV
tymeJV

Reputation: 104775

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");
    }
});

Upvotes: 1

Related Questions