Você está visualizando atualmente Como criar um botão para imprimir a página do navegador – HTML

Como criar um botão para imprimir a página do navegador – HTML

E ai pessoal, de boa?! Vim aqui deixar uma dica rápida para vocês que gostam de programação. Uma pesquisa recente me fez ir atrás e achar o melhor jeito de realizar essa “proeza” (rsrsrs). Quem ai já tentou criar um botão para imprimir a página do navegador em HTML? Depois de encontrar várias formas de fazer, a melhor maneira e mais rápida, como sempre, em apenas uma linha, é criar uma botão com um um comando Javascript:

onClick="window.print()"

Quer aprender mais sobre Javascript e Jquery? clica aqui

Este comando onClick funciona independente da linguagem que você estiver usando, pois é lido direto pelo motor do navegador. Este onClick tanto funciona na tag para links <a> quanto na tag <input> para criar botões dentro de um <form>.

Faça o teste clicando abaixo.

<form>
<input type="button" value="Print this page" onClick="window.print()"/>
</form>

Muito simples de criar e funciona em todos os navegadores. Para ficar exatamente como você gostaria dentro do seu layout, basta acrescentar um estilo pelo CSS à sua escolha e ser feliz com a impressão dos documentos criados pelos seus sistemas ou sites.

imprimir a página do navegador

Apenas uma dica rápida de como criar seu botão para imprimir a página do navegador.

Que saber mais sobre este método Javascript? Veja na W3schools.

Já terminou o seu projeto? Então que tal testar o carregamento do seu site?

Este post tem 12 comentários

    1. João Ellery

      Isso é um código que vc coloca na sua página. Se você chamar essa página externa por um iframe talvez funcione imprimi-la.

  1. Rogério

    Tenho problemas com Sr. GOOGLE que não deixa operar meios de coletas de dados (form)kkkk, estranho e procuro formas alternativas para conseguir TRABALHAR, a opção mostrada é ótima
    simples e objetiva, se existir um jeito SIMPLES direta no servidor vai me ajudar to a beira da fome mas o SR.GOOGLE mata seus admiradores e Usuários de FOME
    Gostei muito
    Parabéns

    1. João Ellery

      vlw!
      😉

  2. Nilton

    Pessoal, uso um evento de click no botão para uma informação.
    O que acontece é que a página html sobe para o topo.

    Como evitar isto?

    Desligar Lâmpada

    1. João Ellery

      Esse é apenas um pedaço do seu código, para descobrir o bug como descrito é necessário analisar o código todo.

  3. Eblanco

    GOSTARIA DESSA MESMA FUNÇÃO, PORÉM PARA IGAGENS

    1. João Ellery

      Basta aplicar no seu código.

  4. Tiago Sousa

    Muito obrigado, eu esprimentei o código, e deu certo. Também utilizo muito o site W3schools, como platafroma de programação esprimental.

    1. João Ellery

      De nada… obrigado você pela visita!

  5. Orlando P Cruz

    Olá Joaoellery,

    Teria como utilizar este código de imprimir, sem o botão aparecer na visualização e impressão?
    Tenho intensão de salvar em PDF e não legal ter o botão no arquivo salvo.
    Valeu

    1. João Ellery

      Você criar uma função em javascript para quando clicar no botão ele sumir.

Deixe um comentário