post
Trocando Imagem da Pagina pelo Usuário Usando Javascript
Publicado em: 25/01/2024 / Atualizado em: 04/02/2024
Com este código abaixo, é possível deixar o seu usuário alterar as imagens do site com apenas um clique. Neste caso, você só precisa deixar todas as tags de imagem que são trocáveis dentro de id="editableSection"
<div id="editableSection"> <img class="editableImage" style="width: 200px" src="https://bruno.art.br/link-da-imagem.png"> <img class="editableImage" style="width: 200px" src="https://bruno.art.br/link-da-imagem.png"> <img class="editableImage" style="width: 200px" src="https://bruno.art.br/link-da-imagem.png"> </div> <script> var images = document.querySelectorAll('.editableImage'); images.forEach(function(image) { image.addEventListener('click', function() { var input = document.createElement('input'); input.type = 'file'; input.accept = 'image/*'; input.addEventListener('change', function() { var file = input.files[0]; if (file) { var reader = new FileReader(); reader.onload = function(e) { image.src = e.target.result; }; reader.readAsDataURL(file); } }); input.click(); }); }); </script>
Publicações recomendadas:
Inscreva-se em Nossa News:
Seja notificando sempre que tiver conteúdo novo disponível no meu canal do Youtube ou artigo no meu Blog.

Link Curto para Compartilhamento
Compartilhe esse conteudo nas redes sociais ou por mensagem usando o link curto abaixo. Basta clicar em cima do link para copiar.
bruno.art.br/pb/4199
ID de Referência: 4199
Sugira uma publicação
Envie uma mensagem e sugira um publicação sobre um assunto que tenha dificuldades de resolver.