Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Henrique Foletto

[Resolvido] Indicador para Input type File

Recommended Posts

Olá a todos, tudo bem?

É possível que eu tenha criado o tópico no lugar errado, se esse for o caso, desculpem-me.

 

Então, o que eu queria é ter um texto default no meu Input type=file, não digo um value, pois isso eu sei que é impossivel, mas tipo um Placeholder, pois eu queria algo como: "Anexe aqui seu arquivo!" que some depois de escolher o arquivo, tentei usar tipo uma div com position:absolute porém a altura varia um pouco entre os navegadores...

 

Desde já, grato. Att,

Henrique Foletto.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Cara creio que não exista uma maneira muito boa pra resolver isso, a solução que me vem a mente seria você criar um input:text normal no qual você anexaria ao evento focus com um trigger() para ativar o campo file, desta maneira quando o usuário focasse no input:text seria o mesmo que focar o input:file, assim você poderia definir o input:file como display:none pra só exibir o campo de texto e colocar o placeholder no input:text

 

Seria algo proximo de:

 

$(':text').bind('focus', function() {
$(':file').trigger('focus');
});

Compartilhar este post


Link para o post
Compartilhar em outros sites

Hmm, interesante Diego, obrigado pela atenção, pois de fato, é uma pergunta difícil de responder, pois tecnicamente é impossível, o jeito é com gambiarra, então acabei fazendo assim:

 

<script type="text/javascript">
function removeadd() {
var addon = document.getElementById('anexartxt');
var uploader = document.getElementById('arquivo');
uploader.addEventListener('change',removetotal,false);
function removetotal(){
addon.style.display = 'none';
}
}
</script>

 

Estranhamente o onchange="" nao funcionou entao usei o onclick e na função fiz o onchange, deu bem certo!

 

<input type="file" name="arquivo" id="arquivo" size="0" onclick="removeadd(this)" />

 

e fiz uma div com position:absolute assim:

 

<div id="anexartxt" style="width: auto; height: auto; cursor: pointer;	position: absolute;	top: 485px; left: 151px;	z-index: 3; font: 16px/18px Arial, Helvetica, sans-serif;">Anexe seu arquivo aqui</div>

 

Obrigado pela atenção!

 

Att, Henrique Foletto.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.