Porque eu não consigo digitar texto no input ".tarefa-edit" que foi criado com o jQuery?
$(function(){
function onTarefaDeleteClick(){
$(this).parent('.tarefa-item').hide('slow', function(){
$(this).remove();
});
}
$('.tarefa-delete').click(onTarefaDeleteClick);
});
$(function(){
function onTarefaItemClick(){
var text = $(this).children('.tarefa-texto').text();
var html = '<input type="text" ' + 'class="tarefa-edit" value="' + text + '">';
$(this).html(html);
$('.tarefa-edit').keydown(onTarefaEditKeydown);
}
$('.tarefa-item').click(onTarefaItemClick); //
});
function onTarefaEditKeydown(event){
if(event.which === 13){
savePendingEdition($(this));
}
}
function savePendingEdition(tarefa){
console.log('...');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="todo">
<h2>TODO List</h2>
<input type="text" id="tarefa">
<div id="tarefa-lista">
<div class="tarefa-item">
<div class="tarefa-texto">Comprar pão</div>
<div class="tarefa-delete"></div>
<div class="clear"></div>
</div>
</div>
</div>
.keydown
não costuma funcionar com elementos criados dinamicamente, sugiro trocar por$(document).on('keydown', ".tarefa-edit",onTarefaEditKeydown)
. Teste e informe se deu certo, não consegui testar porque não tem um exemplo testável na sua pergunta