Kopírování textu pomocí tlačítek

    4

    Publikujete na svých stránkách návody, zdrojové kódy a podobné články, kterými vysvětlujete čtenářům řešení některých problémů? Pak jim zjednodušte uložení zadaného textu z webu na lokální počítač.

    Stačí jedno klepnutí na tlačítko, kterým zkopírujete text do schránky a pak například v Poznámkovém bloku uložíte na svůj disk nebo do zdrojového kódu stránky. Omezení tohoto skriptu je v podpoře prohlížečů (Netscape ani Opera to neumí). Zde je vlastní skript:

    <script language=“Javascript“>
    <!–
    function kopiruj() {
    text = document.body.createTextRange();
    text.moveToElementText(id_textu);
    text.execCommand(„Copy“);
    }
    //–>
    </script>

    Zaměřte se na druhý řádek funkce. Sem zadáte do závorek identifikátor části textu stránky (v tomto případě je to ‚id_textu‘), který chcete kopírovat. Tělo stránky bude vypadat takto.

    <body>
    Nějaký text který nebudete kopírovat…
    <div id=“id_textu“ style=“…“>Tento text se bude kopírovat</div>
    <BUTTON onclick=“kopiruj()“ Kopírovat</BUTTON>
    Zde bude další text který se již kopírovat nebude…
    </body>

    Klepnutím na tlačítko se zadaný text zkopíruje do schránky, odkud ho můžete kamkoli vložit.

    Další možnosti skriptu

    Ve skriptu lze aplikovat také další dva příkazy – Vyjmout a Vložit. Pro Vyjmutí zadáte do závorek třetího řádku funkce příkaz Cut a pro vložení Paste. Otázka je, zda najdou tyto příkazy na webové stránce uplatnění. Další možností, jak zvýšit flexibilitu tohoto skriptu, je použití této funkce s více argumenty. Určitě bych použil jako argument identifikátor textu (i příkazy by se mohli hodit). Výsledný skript by měl tuto podobu.

    <html>
    <head>
    <script language=“Javascript“>
    <!–
    function proved(fun, kam) {
    text = document.body.createTextRange();
    text.moveToElementText(kam);
    text.execCommand(fun);
    }
    //–>
    </script>
    </head>
    <body>
    <span id=“prvni“ style=“height:20; width:200;border:1 ridge black;text-align:center;“>Prvni text</span>
    <span id=“druhy“ style=“height:20; width:200;border:1 ridge black;text-align:center;“>Druhy text</span><br>
    <BUTTON STYLE=“margin:5px“ onclick=“proved(‚Copy‘, prvni)“>Kopíruje první text</BUTTON>
    <BUTTON STYLE=“margin:5px“ onclick=“proved(‚Cut‘, prvni)“>Vyjme první text</BUTTON>
    <BUTTON STYLE=“margin:5px“ onclick=“proved(‚Paste‘, prvni)“>Vloží kopírovaný nebo vyjmutý text</BUTTON><br>
    <BUTTON STYLE=“margin:5px“ onclick=“proved(‚Copy‘, druhy)“>Kopíruje druhý text</BUTTON>
    <BUTTON STYLE=“margin:5px“ onclick=“proved(‚Cut‘, druhy)“>Vyjme druhý text</BUTTON>
    <BUTTON STYLE=“margin:5px“ onclick=“proved(‚Paste‘, druhy)“>Vloží kopírovaný nebo vyjmutý text</BUTTON>
    </body>
    </html>

    Zde si můžete příklad vyzkoušet:
    Klepnutím na tlačítko se vám do schránky nakopíruje kód, jehož funkční podobu můžete vidět zde.

    Starší komentáře ke článku

    Pokud máte zájem o starší komentáře k tomuto článku, naleznete je zde.

    4 Příspěvků v diskuzi

    1. cp

      Mate tam pravopisnou chybu, zapomnel jste ukoncit sekci BUTTON znakem >
      Ted uz to funguje, taky mi to poprve neslo, az kdyz jsem se na ten kod podival poradne, tak pak me to trklo :-D (nejake vzpominky z IT prece jen zustaly a nebyly nadarmo :-)

    Odpovědět