Ir para conteúdo
Fórum Script Brasil
  • 0

Ao clicar no text vira input, ao perder foco vira text de novo...


Regis Lacerda

Pergunta

Fala galera, estou com um probleminha co javascript...

Eu tenho uma tabela onde será apresentado alguns dados vindos do banco de dados. Quando o usuário clicar sobre o nome ele deve mudar aquele texto para input text e quando a pessoa tirar o foco daquele campo ele deve voltar a ser texto com o valor digitado pelo usuário...

Iniciei dessa forma, porém, ele muda para input text, porém, não voltar para texto normal...

Segue o código

<td width="500">
  <div id="updateDinamico1" onclick=this.style.display="none";document.getElementById("updateDinamico2").style.display="";document.getElementById("inputText").focus() >
    Texto que pode ser alterado
  </div>
  <div id="updateDinamico2" style="display:none;" onblur=this.style.display="none";document.getElementById("updateDinamico1").style.display=""; >
    <input type="text" id="inputText" name="nome" />
  </div>
</td>

Não funciona passando o valor de block no style.display

Editado por Regis Lacerda
Link para o comentário
Compartilhar em outros sites

6 respostass a esta questão

Posts Recomendados

  • 0

onclick=this.style.display="none";document.getElementById("updateDinamico2").style.display="";document.getElementById("inputText").focus()

Não faça isso, pelamordedeus, minha vista doeu aqui. Sério mesmo, rofl.

Seu código não funciona porque em nenhum momento o div pegou o focus, logo ele nunca ativará um onblur. O onBlur deve ficar no input.

<script>

function clickDiv(div) {
    div.style.display="none";
    document.getElementById("updateDinamico2").style.display = "inline";
    document.getElementById("inputText").focus();
}
function blurInput(input) {
    var div = input.parentNode;
    div.style.display = "none";
    document.getElementById("updateDinamico1").style.display = "inline";
}


</script>

<td width="500">
  <div id="updateDinamico1" onclick='clickDiv(this)'>
    Texto que pode ser alterado
  </div>
  <div id="updateDinamico2" style="display:none">
    <input type="text" id="inputText" name="nome" onBlur='blurInput(this)' />
  </div>
</td>

Editado por fiote
Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152k
    • Posts
      651,8k
×
×
  • Criar Novo...