 |
|
Você está aqui: JavaScript ::: Elementos de Formulários HTML ::: input type file Element/Object |
Como ocultar um input type file e usar um botão ou uma imagem para permitir que o usuário selecione o(s) arquivo(s)Quantidade de visualizações: 7485 vezes |
|
Por padrão, um input type file é exibido como um botão escrito "Escolher arquivo" e o texto "Nenhum arquivo selecionado" logo ao lado. Às vezes gostaríamos de mudar esta aparência, talvez para um melhor ajuste no nosso design. Nesta dica eu mostro como podemos ocultar o input type file e fornecer um outro botão ou uma imagem em seu lugar. Veja primeiro como usar um botão comum: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Estudos JavaScript</title>
</head>
<body>
<form>
<input id="arquivo" name="arquivo" type="file" style="display:none">
<button onclick="escolherArquivo()">Escolha o arquivo</button>
</form>
<script type="text/javascript">
function escolherArquivo(){
// vamos obter uma referência ao elemento file
var arquivo = document.getElementById("arquivo");
// vamos disparar seu evento onclick()
arquivo.click();
}
</script>
</body>
</html>
Note que usamos a propriedade style do input type file para definir o valor display:none, ocultando-o. Em seguida temos um botão e, no seu evento onclick(), nós chamamos uma função JavaScript responsável por disparar o evento click() do input type file. Veja agora como podemos usar uma imagem: ---------------------------------------------------------------------- Se precisar de ajuda com o código abaixo, pode me chamar no WhatsApp +55 (62) 98553-6711 (Osmar) ---------------------------------------------------------------------- <form> <input id="arquivo" name="arquivo" type="file" style="display:none"> <a href="javascript:escolherArquivo()"><img src="upload.jpg" border="0" /></a> </form> Abra essa página no seu navegador e clique na imagem. Você verá que automaticamente a janela de seleção de arquivo(s) será exibida. |
 Link para compartilhar na Internet ou com seus amigos: |
JavaScript ::: Dicas & Truques ::: Matemática e Estatística |
JavaScript para matemática - Como obter o menor entre dois ou mais valores numéricos usando a função min() do JavaScriptQuantidade de visualizações: 7743 vezes |
|
A função min() do objeto Math da linguagem JavaScript pode ser usada quando temos dois ou mais valores numéricos e gostaríamos de retornar o menor deles. Note que esta função não aceita um vetor (array) como argumento, ou seja, os valores devem ser fornecidos de forma literal ou passados como variáveis independentes. Veja o código JavaScript completo para o exemplo: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<html>
<head>
<title>Estudando JavaScript</title>
</head>
<body>
<script type="text/javascript">
var n1 = 45;
var n2 = 18;
var menor = Math.min(n1, n2);
document.write("O menor número é " + menor);
</script>
</body>
</html>
Ao executar este código nós teremos o seguinte resultado: O menor número é 18 O retorno do método min() é um objeto Number representando o menor dos valores fornecidos. Se nenhum argumento for informado, o retorno será um objeto Infinity, enquanto um objeto NaN será retornado se algum dos valores fornecidos não for um valor numérico válido. |
JavaScript ::: Dicas & Truques ::: Strings e Caracteres |
Como remover todos os espaços de uma string em JavaScript usando uma função personalizada remover_espacos()Quantidade de visualizações: 94 vezes |
|
Nesta dica mostrarei como é possível escrever uma função JavaScript que remove todos os espaços de uma string. É claro que você poderá, com uma pequena modificação, alterá-la para que ela substitua quais outros caracteres. Esse é também um bom exercício para a criação de funções na linguagem JavaScript. Veja o código completo: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!doctype html>
<html>
<head>
<title>Estudos JavaScript</title>
</head>
<body>
<script type="text/javascript">
// função personalizada que remove os
// espaços de uma string
function remover_espacos(str){
var r = "";
for(var i = 0; i < str.length; i++){
if(str.charAt(i) != ' '){
r += str.charAt(i);
}
}
return r;
}
</script>
<script type="text/javascript">
// vamos mostrar a frase normal
var frase = "Gosto muito de JavaScript e HTML";
document.write(frase + "<br>");
// vamos remover os espaços
frase = remover_espacos(frase);
// e agora vamos mostrar o resultado
document.write(frase);
</script>
</body>
</html>
Ao executar este código nós teremos o seguinte resultado: Gosto muito de JavaScript e HTML GostomuitodeJavaScripteHTML |
JavaScript ::: Dicas & Truques ::: Cookies |
Como verificar se cookies estão habilitados no navegador do usuário usando JavaScriptQuantidade de visualizações: 2 vezes |
|
Em algumas situações nós gostaríamos de checar se os cookies estão habilitados no browser do usuário antes de gravarmos alguma informação. Nesta dica eu mostro como isso pode ser feito. Note que tudo que precisamos fazer é criar um cookie temporário e tentar acessá-lo em seguida. Veja o código completo para o exemplo (incluindo a página HTML): ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!doctype html>
<html>
<head>
<title>Estudos JavaScript</title>
</head>
<body>
<script type="text/javascript">
// vamos criar um cookie temporário
var cookieTemp = (new Date()).getTime() + '';
// colocamos o cookie como parte do documento
document.cookie = "cookieTemp=" + cookieTemp + "; path=/";
// o cookie existe?
if (document.cookie.indexOf(cookieTemp, 0) < 0){
window.alert("Os cookies não estão habilitados no seu navegador");
}
else{
window.alert("Os cookies estão habilitados no seu navegador");
}
</script>
</body>
</html>
Ao executar este código teremos o seguinte resultado: Os cookies estão habilitados no seu navegador. |
Desafios, Exercícios e Algoritmos Resolvidos de JavaScript |
Veja mais Dicas e truques de JavaScript |
Dicas e truques de outras linguagens |
Códigos Fonte |
 Software de Gestão Financeira com código fonte em PHP, MySQL, Bootstrap, jQuery - Inclui cadastro de clientes, fornecedores e ticket de atendimentoDiga adeus às planilhas do Excel e tenha 100% de controle sobre suas contas a pagar e a receber, gestão de receitas e despesas, cadastro de clientes e fornecedores com fotos e histórico de atendimentos. Código fonte completo e funcional, com instruções para instalação e configuração do banco de dados MySQL. Fácil de modificar e adicionar novas funcionalidades. Clique aqui e saiba mais |
 Controle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidadesTenha o seu próprio sistema de controle de estoque web. com cadastro de produtos, categorias, fornecedores, entradas e saídas de produtos, com relatórios por data, margem de lucro e muito mais. Código simples e fácil de modificar. Acompanha instruções para instalação e criação do banco de dados MySQL. Clique aqui e saiba mais |
Linguagens Mais Populares |
|
1º lugar: Java |
