V dnešním článku si ukážeme, jak s pomocí JavaScriptu zabudovat do webových stránek formulář pro prohledávání českého Internetu. Náš skript je navíc doplněn o možnost výběru hledače ze šesti u nás nejznámějších vyhledávacích serverů a jednoho zahraničního.

Pro praktickou ukázku jsme vybrali šest největších českých serverů – Seznam. Atlas, Centrum, Zmiji, Uzdroje a Najdi.to, ze světových pak u nás nejpopulárnější Altavistu.

Nejprve si nadefinujeme samotný formulář, který bude obsahovat textové pole pro zadávání hledaných klíčových slov, dále pak seznam podporovaných vyhledávacích serverů s možností volby hledače, který vyhledávání provede (volba pomocí radio buttonu) a tlačítko, které odešle požadavek. Formulář nadefinujeme přímo v Javascriptu, protože u prohlížečů nepodporující JavaScript by tento formulář nefungoval. Těm je možno nabídnout náhradní řešení v tagu <NOSCRIPT>. Skript pak vypadá následovně:

<script language=“JavaScript“>
<!–
document.write(„<form name=’search‘ method=’post‘ action=“ onSubmit=’poslat();’>“);
document.write(„<input type=’text‘ name=’text’><input type=’submit‘ name=’hledej‘ value=’Hledej!’><br>“);
document.write(„<input type=’radio‘ name=’server‘ checked>Altavista
„);
document.write(„<input type=’radio‘ name=’server’>Seznam<br>“);
document.write(„<input type=’radio‘ name=’server’>Atlas<br>“);
document.write(„<input type=’radio‘ name=’server’>Centrum<br>“);
document.write(„<input type=’radio‘ name=’server’>Zmije<br>“);
document.write(„<input type=’radio‘ name=’server’>Uzdroje<br>“);
document.write(„<input type=’radio‘ name=’server’>Najdi.to“) ;
document.write(„</form>“) ;
// –>
</script>
<noscript>
</noscript>


Pokud podrobně prozkoumáte uvedený skript, zajisté si všimnete, že při odeslání formuláře je volána metodou onSubmit funkce poslat(). Tu nadefinujeme následovně:

function poslat()
{
var keyword = document.search.text.value;
keyword = uprava_retezec(keyword);
odeslat_server(text) ;
return false;
}


Funkci poslat() jsme tak rozdělili na dvě části. V první bude provedena analýza hledaného řetězce, která zahrnuje následující operace: nahrazení mezer v řetězci znakem „+“ a znaménko plus v řetězci je nahrazeno znakem „%2B“, což je hodnota mezery v hexadecimálním kódování. Podobně budou přeloženy všechny znaky řetězce pomocí funkce escape().

function uprava_retezec(text)
{
var retezec=““;
for (var i=0; i<text.length;++i){
if(text.charAt(i)==‘ ‚) retezec = retezec + „+“;
else if(text.charAt(i)==’+‘) retezec = retezec + „%2B“;
else retezec= retezec + escape(text.charAt(i));
}
return retezec;
}


Funkce odeslat_server() pak zjistí, který vyhledávač byl zvolen a odešle požadavek na něj pomocí URL, složeného z adresy vyhledávacího skriptu a upraveného řetězce

function odeslat_server(text)
{
var server = document.search.server
if (server[0].checked == true ){var url =“http://www.altavista.com/cgi-bin/query?pg=q&kl=XX&stype=stext&q=“+ text};
if (server[1].checked == true ){var url =“http://www.seznam.cz/hledej.cgi?string=“+ text};
if (server[2].checked == true ){var url =“http://www.atlas.cz/search.asp?searchtext=“ + text};
if (server[3].checked == true ){var url =“http://fulltext.centrum.cz/search.php?go=1&top=0&q=“ + text + „&submit=+hledej%21+&sec=all“};
if (server[4].checked == true ){var url =“http://www.zmije.cz/zmije2/ftxt_zmije.asp?ftxt_query=“+ text};
if (server[5].checked == true ){var url =“http://www.uzdroje.cz/cgi-bin/najdi?query=“ + text};
if (server[6].checked == true ){var url =“http://1.najdi.to/index.php3?scenar=1&type=1&dotaz=“ + text};
window.open(url, ‚nove_okno‘)
}


Výsledek hledání se otevře v novém okně. Na závěr zbývá ukázat výsledek naší práce:

Při vyhledávání lze většinou bez problémů použít i logické operátory „+“, „-„, „AND“, „OR“, „NOT“. Je třeba si však uvědomit, zdali je zvolený server podporuje a podle toho je požívat. Skript lze samozřejmě libovolně obměňovat – např. vybrat jen některé servery nebo naopak jiné doplnit, volbu serveru provést pomocí roletového menu apod. Zde je k dispozici celý zdrojový kód ke stažení (1 KB).

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

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

Žádný příspěvek v diskuzi

Odpovědět