clicar numa TD e transforma-la em INPUT

[Ricardo T. do Prado]

Olá,

Pessoal, preciso de uma ajuda para criar uma grid editável, o problema é:

- Quando eu clicar numa celula da tabela, ela crie um INPUT (dentro da TD) e jogar o valor da TD dentro do input.

Fiz um código aqui e funciona, mas eu o valor fica na TD e NA INPUT e se eu clicar mais de uma vez , vai gerando N inputs.

segue código:

<script>
$(document).ready(function() {
    $("#grid td").click(function() {
        var valor = $(this).text(); //até aqui ok
        var nome = $(this).attr("name");
        $('<input>').attr('type', 'text').attr('name',nome).attr('value',valor).appendTo($(this));
    });
});
</script>

[Willian Gustavo Veiga]

Por que você não usa content editable?

[fiote]

A dica do Willian é bem interessante, mas em relação ao seu script...

1) O texto continua no td porque em nenhum momento você mandou ele sair de lá. Antes de inserir o input dentro do TD, mude o conteúdo do td para "vazio".

2) Além disso, logo depois de inserir o input, você deve "retirar" o evento click. Dessa forma o script não é chamado mais de uma vez.