Tabulátor - doplnění proměnné – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama
Reklama

Tabulátor - doplnění proměnné – JavaScript, AJAX, jQuery – Fórum – Programujte.comTabulátor - doplnění proměnné – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 

Toto vlákno bylo označeno za vyřešené — příspěvek s řešením.
Hledá se programátor! Plat 1 800 € + bonusy (firma Boxmol.com)
RePRO0
Super člen
13. 8. 2011   #1
-
0
-

Zdravím,

pokud znáš chaty (xchat.cz, lide.cz, libimseti.cz), tak určitě znáš tu kravinku, že pokud napíšeš třeba RE, a poté stiskneš klávesu TAB, tak se Ti doplní celá přezdívka -- třeba RePRO.

  • Neví někdo jak na tento zapeklitý skript? :-)

Díky, RePRO.

Nahlásit jako SPAM
IP: 95.82.185.–
Software: C; C++; C#; Pascal; Delphi; Java Webdesign: PHP; MySQL; CSS; jQuery; Ajax; Javascript; OOP
Reklama
Reklama
KIIV+42
God of flame
13. 8. 2011   #2
-
0
-

pravdepodobne pouzijou handler stisknutych klaves (treba z jquery)... viz google

Nahlásit jako SPAM
IP: 93.91.152.–
Program vždy dělá to co naprogramujete, ne to co chcete...
Řešení
1321645679876456
~ Anonymní uživatel
27 příspěvků
14. 8. 2011   #3
-
+4
-
Informačně přínosné
Vyřešeno Nejlepší odpověď

Já bych to viděl nějak takhle:

<!doctype html>
<html>
    <head>
        <title>
            Test
        </title>
        <meta
            http-equiv="Content-Type"
            content="text/html; charset=utf-8"
        />
        <script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
        <script>
            (function($) {
                $.fn.complete = function(params) {
                    params = $.extend({
                        words: [],
                        key: 9,
                        callback: $.noop
                    }, params);
                    var $area = this.keydown(function(event) {
                        if (event.which == params.key) {
                            var
                                value = $.trim($area.val()),
                                similar = [];
                            if (value) {
                                var text = value.split(' ').slice(-1)[0].toLowerCase();
                                $.each(params.words, function(id, word) {
                                    if (
                                        word.length > text.length &&
                                        word.slice(0, text.length).toLowerCase() == text &&
                                        $.inArray(text, similar) == -1
                                    )
                                        similar.push(word);
                                });
                            }
                            params.callback(similar.sort());
                            return false;
                        }
                    });
                };
            }(jQuery));
            
            $(function() {
                $('textarea').complete({
                    words: [
                        'Nula',
                        'Jedna',
                        'Dvě',
                        'Tři',
                        'Čtyři',
                        'Pět',
                        'Šest',
                        'Sedm',
                        'Osm',
                        'Devět',
                        'Deset',
                        'Jedenáct',
                        'Dvanáct',
                        'Třináct',
                        'Čtrnáct',
                        'Patnáct',
                        'Šestnáct',
                        'Sedmnáct',
                        'Osmnáct',
                        'Devatenáct',
                        'Dvacet'
                    ],
                    callback: function(words) {
                        var $words = $('select').empty();
                        words.map(function(word) {
                            $words.append('<option>' + word + '</option>');
                        });
                        var $options = $('option', $words);
                        if ($options.length) {
                            $options.eq(0).attr('selected', true);
                            if ($options.length == 1)
                                $words.trigger('dblclick');
                            else
                                $words.show().focus();
                        }
                    }
                });

                $('select').bind({
                    dblclick: function() {
                        var
                            $area = $('textarea'),
                            $words = $('select'),
                            value = $.trim($area.val()),
                            last = value.split(' ').slice(-1)[0],
                            word = $words.val(),
                            lowerCase = $.inArray(last[0], 'aábcčdďeéfghiíjklmnňoópqrřsštťůúvwxyýzž') != -1;
                        word = word[0][lowerCase ? 'toLowerCase' : 'toUpperCase']() + word.slice(1);
                        value = value.slice(0, value.length - last.length) + word;
                        $area.val(value).focus();
                    },
                    keydown: function(event) {
                        switch(event.which) {
                            case 13:
                                $(this).trigger('dblclick');
                                break;
                            case 27:
                                $('textarea').focus();
                                break;
                            default:
                                return true;
                        }
                        return false;
                    },
                    blur: function() {
                        $(this).hide();
                    }
                });
            });
        </script>
    </head>
    <style>
        textarea, select {
            width: 300px;
        }
        
        select {
            display: none;
        }
    </style>
    <body>
        <textarea></textarea>
        <br />
        <select size="4"></select>
    </body>
</html>

Místo selectu můžeš snadno použít nějaké vlastní menu pro výběr slov, ten select jsem tam dal pro ukázku.

Nahlásit jako SPAM
IP: 83.240.95.–
RePRO0
Super člen
24. 8. 2011   #4
-
0
-

Díky moc. Akorát bych ještě chtěl přidat svůj seznam slov. V PHP mám napsanou svou funkci getUsers, která vrací pole. Tak jak to do toho zakomponovat... Ty si hodně zkušenej člověk přes jQuery. Kdybys byl reglej, už máš u mě reputaci.

Nahlásit jako SPAM
IP: 95.82.185.–
Software: C; C++; C#; Pascal; Delphi; Java Webdesign: PHP; MySQL; CSS; jQuery; Ajax; Javascript; OOP
1321645679876456
~ Anonymní uživatel
27 příspěvků
24. 8. 2011   #5
-
0
-

Dalo by se to řešit více způsoby, třeba načítat ajaxem: 

$(function() {
   
    // Po načtení stránky načteš pole se slovy jako JSON řetězec z words.php
    $.get('words.php', function(words) {
        $('textarea').complete({
           
            // a tady ho rozparsuješ zpátky do pole a předáš jako parametr funkci $.complete()
            'words': $.parseJSON(words),

            callback: function(words) {
               
                ...   
               
            }
        });
    });

    ...

});
Nahlásit jako SPAM
IP: 83.240.95.–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 30 hostů

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032016 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý