Funkce php, které chybí v javascriptu
strip_tags
trim
htmlspecialchars
jednodušší práce s cookies
a další
http://mike.treba.cz/javascriptove-ekvivalenty-php-funkci/
-----------------------
zdroj: http://www.webcheatsheet.com/PHP/get_current_page_url.php
//vraci aktualni adresu url
function curPageURL() {
$pageURL = 'http';
if ($_SERVER["HTTPS"] == "on") {$pageURL .= "s";}
$pageURL .= "://";
if ($_SERVER["SERVER_PORT"] != "80") {
$pageURL .= $_SERVER["SERVER_NAME"].":".$_SERVER["SERVER_PORT"].$_SERVER["REQUEST_URI"];
} else {
$pageURL .= $_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"];
}
return $pageURL;
}-------------------------
zdroj:
http://www.webcheatsheet.com/PHP/get_current_page_url.php// detekce - zjištění index botů, pavouků a pod.
$interestingCrawlers = array( 'google', 'yahoo' );
$pattern = '/(' . implode('|', $interestingCrawlers) .')/';
$matches = array();
$numMatches = preg_match($pattern, strtolower($_SERVER['HTTP_USER_AGENT']), $matches, 'i');
if($numMatches > 0) // Found a match
{
// $matches[1] contains an array of all text matches to either 'google' or 'yahoo'
}----------------
Vyhledávání v select inputu (boxu)
<HTML><HEAD><SCRIPT type="text/javascript">
function searchSel() {
var input=document.getElementById('realtxt').value.toLowerCase();
var output=document.getElementById('realitems').options;
for(var i=0;i<output.length;i++) {
if(output[i].value.indexOf(input)==0){
output[i].selected=true;
}
if(document.forms[0].realtxt.value==''){
output[0].selected=true;
}
}
}
</SCRIPT></HEAD><BODY>
<FORM>
Search <input type="text" id="realtxt" onkeyup="searchSel()">
<SELECT id="realitems">
<OPTION value="">Select...
<OPTION value="afghanistan">Afghanistan
<OPTION value="albania">Albania
<OPTION value="algeria">Algeria
<OPTION value="andorra">Andorra
<OPTION value="angola">Angola
</SELECT>
</FORM></BODY></HTML>
zdroj:
http://www.rgagnon.com/jsdetails/js-0089.htmlvarianta 2
<script>
function searchList(inText, drpBox){
var iCount;
var regEx = new RegExp(inText, 'i');
for (iCount=0; iCount<drpBox.length; iCount++){
if (drpBox[iCount].value.match(regEx)){
drpBox.selectedIndex = iCount;
break;
}
}
}
</script>
<input type="text" name="txtSearch" id="txtSearch" value="search list" onfocus="if (this.value == 'search list'){ this.value='';}" onkeyup="searchList(this.value, document.forms['zadani'].drpSponsor);" /><br/>
<SELECT name="drpSponsor" id="drpSponsor">
<OPTION value="">Select...
<OPTION value="afghanistan">Afghanistan
<OPTION value="albania">Albania
<OPTION value="algeria">Algeria
<OPTION value="andorra">Andorra
<OPTION value="angola">Angola
</SELECT>Zdroj:
http://lists.evolt.org/pipermail/javascript/2004-June/007359.html-------------------
Uraven a vylepšen výše uvedený skript
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
</head>
<body>
<script language="JavaScript">
function searchSel(posledni_pozice) {//posledni_pozice - pro hledani dalsich vysledku
var input=document.getElementById('hledej_kategorii').value.toLowerCase();
var output=document.getElementById('strom_kategorii').options;
for(var i=0;i<output.length;i++) {
mala_pismena=output[i].text.toLowerCase();//pridana moznost nezavislost na velikosti .text. (popisku)- .text. hleda v popisu co je videt, .value. hleda v hodnotach co se odesilaji
//if(mala_pismena.indexOf(input)==0){//hleda na zacatku
if(mala_pismena.indexOf(input)!=-1){//hleda i uprostred
document.zadani.button_hledej.value="další možný výsledek >>>";//hledej dalsi
if(posledni_pozice<output[i].index)
{
output[i].selected=true;
//alert('delka:'+output.length);alert('posl:'+posledni_pozice);alert('souc ind:'+output[i].index);
return output[i].index;//return pridan aby to neselectovalo az posledni vyskyt
}
}
if(output[i].index==(output.length-1))
{alert('Výsledky dosáhly konce kategorií, jestli chcete pokračovat od začátku klikněte znovu na tlačítko "další výsledky"');return 0;}
}
}
//document.getElementById('systemova_zprava').innerHTML='Kategorie nenalezena, zkuste přeformulovat, nebo najít přímo v roletovém menu';output[0].selected=true;
posledni_pozice=0;
</script>
<form name="zadani" id="zadani" >
<div id="systemova_zprava" ></div>
Hledej<input type="text" id="hledej_kategorii" name="hledej_kategori" onfocus="posledni_pozice=0;document.getElementById('strom_kategorii')[0].selected=true;" onkeyup="
if(document.zadani.hledej_kategorii.value.length>3){if(document.zadani.hledej_kategorii.value!=''){posledni_pozice=searchSel(posledni_pozice);}}">
<input type="button" nama="button_hledej" id="button_hledej" onclick="if(document.zadani.hledej_kategorii.value!=''){posledni_pozice=searchSel(posledni_pozice);}" value="hledej kategorii">
<SELECT name="strom_kategorii" id="strom_kategorii" size="20">
<option value="23">abc</option>
<option value="2318">abbc</option>
<option value="2307">abcd</option>
</SELECT>
</form>
</body>
</html>
funkce: při zadání do pole více jak 3 položky, tak automaticky najde a označí záznam v select poli, další záznam možno hledat tlačítkem další.
(vyhledává v popisu nikoliv v value, které se odesílá na server. Hledá záznam i uprostřed textu a nezávisle na velikosti písmen) Testováno zatím na FF 3.6
-----------------
Inkrementální (přírůstkové) vyhledávání v select boxu (drop down - roletové menu)
Popis: při aktivaci select boxu a zadání písmene na klávesnici se běžně vybere záznam pouze s jedním písmenem na začátku. Při dalším zmáčknutí dalšího písmene opět vybere záznam s tímto písmenem na začátku. Skript by měl umožnit zadat více písmen z jednoho záznamu a tak hledat záznam podle více písmen. Je to vhodné u seznamů s více stejnými záznamy od stejného zač. písmene.
Zdroj:
http://www.codeproject.com/KB/scripting/Auto_select_Dropdown.aspxNejprve se mi to podařilo zkušebně zprovoznit , ale po druhé mi to již hlásilo chybu chybí handler.
----------------------------
Skript pro vložení textu na pozici myši (kliku myši)
funguje, odzkoušeno (input, area)
function insertAtCursor(myField, myValue) {
//IE support
if (document.selection) {
myField.focus();
sel = document.selection.createRange();
sel.text = myValue;
}
//MOZILLA/NETSCAPE support
else if (myField.selectionStart || myField.selectionStart == '0') {
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
myField.value = myField.value.substring(0, startPos)
+ myValue
+ myField.value.substring(endPos, myField.value.length);
} else {
myField.value += myValue;
}
}
// calling the function
insertAtCursor(document.formName.fieldName, 'this value');Zdroj:
http://alexking.org/blog/2003/06/02/inserting-at-the-cursor-using-javascript-----
online obfuscátor javascriptu - slouží k znepřehlednění a zmenšení kódu.
zdroj:
http://cs.wikipedia.org/wiki/Obfuscatorodzkoušeno - funkční.
------------------------
resetování - reset, vymazání input pole file
princip je v tom, že se celý input obalí do nějakého tagu a pak se nechá javascriptem načíst znovu.
Zkoušeno ve FF, funguje.
<script> function clearFileInputField(tagId) { document.getElementById(tagId).innerHTML = document.getElementById(tagId).innerHTML; } </script> <span id="uploadFile_span">
<input id="ad_picture" type="file" name="ad_picture" />
</span>
<input type="button" value="Resetovat input file pole" onclick="clearFileInputField('uploadFile_span')" title="Smaže cestu k již vybranému souboru">
zdroj:
http://gusiev.com/2009/04/clear-upload-file-input-field/-------------------------
Zalomení textu na tlačítku: lze použít znak & # 10 (bez mezer)
<input type="submit" value=" & # 10
Odešli & #1 0
formulář & # 10
" />
--------------------------
stránka věnující se cross side scripting ve firefoxu, konkrétně drag and drop - přetahování souborů myší na input pole.
funkční asi pouze pokud přenastavíte bezpečnost firefoxu.
Neodzkoušeno.
http://www.wyden.com/web/java/creating-a-mozilla-firefox-drag-and-drop-file-upload-script-----------------------------
vyžádání události z funkce, resp. skriptem.
Příklad. chcete js. změnit select menu a současně na změnu napojit i událost onchange. (Přitom to ale nechcete psát do tagu select. V mém případě jsem to použil iframe s cizím zdrojem)
Řešení:
Pro IE
Element.fireEvent(eventName)
txt.fireEvent(’onChange’);
Pro FF
var evt = document.createEvent('HTMLEvents'); evt.initEvent('change', true, true);
txt.dispatchEvent(evt);
The first parameter here is the name of the event. The second one indicates whether the event can bubble or not. And the final one specifies whether or not the event’s default action can be prevented or not.
pro volání události z nadřazeného okna do podřízeného okna rodiče
var evt = document.createEvent('HTMLEvents');
evt.initEvent('change', true, true);
window.opener.ifr.document.getElementById('id_prvku').dispatchEvent(evt);
ifr je nazev podřízeného rámu
popis: v hlavním okně je iframe s id ifr, z hlavního okna otevřu nové okno a v něm načtu tento skript, který volá událost change v podřízeném okně - iframu. Tj. přes 2 úrovně. nové okno - rodičovské okno - iframe.
Zdroj:
http://www.rakshith.net/blog/?p=35----------------------------------------------------
Cross side script
Jak změnit parent.location na this.location např. při tom, kdy iframe z cizí adresy pokouší změnit adresu nadřazeného dokumentu. (nutno povolit u sebe v pc ve FF bezp. pojistku)
Pak to jde pomocí funkce:
function zmen_parent() { netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
ifr.addEventListener('click', function() {
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");this.parent=this;}, true); }
+ navázat to na onload v tagu iframe.
-------------------------
volání funkce v jiném iframu nebo rámu
document.getElementById('ifr_id').contentWindow.nazev_vlastni_fce(); // do jineho iframu
případně z podřízeného do rodičovského
parent.nazev_vlastni_fce();
zkoušeno FF.
--------------------------
průběh načítání stránky - javascript + css
funkci volat, resp. spustit ihned, zastavení navázat na událost onload konkr. okna (většinou se asi volá a zobrazuje v jednom okně a kontroluje se, načítá se okno nebo iframe druhý)
<style>
/* position the bars and balls correctly (rotate them and translate them outward)*/
.bar1 {
-moz-transform:rotate(0deg) translate(0, -40px);
-webkit-transform:rotate(0deg) translate(0, -40px);opacity:0.12;
}
.bar2 {
-moz-transform:rotate(45deg) translate(0, -40px);
-webkit-transform:rotate(45deg) translate(0, -40px);opacity:0.25;
}
.bar3 {
-moz-transform:rotate(90deg) translate(0, -40px);
-webkit-transform:rotate(90deg) translate(0, -40px);opacity:0.37;
}
.bar4 {
-moz-transform:rotate(135deg) translate(0, -40px);
-webkit-transform:rotate(135deg) translate(0, -40px);opacity:0.50;
}
.bar5 {
-moz-transform:rotate(180deg) translate(0, -40px);
-webkit-transform:rotate(180deg) translate(0, -40px);opacity:0.62;
}
.bar6 {
-moz-transform:rotate(225deg) translate(0, -40px);
-webkit-transform:rotate(225deg) translate(0, -40px);opacity:0.75;
}
.bar7 {
-moz-transform:rotate(270deg) translate(0, -40px);
-webkit-transform:rotate(270deg) translate(0, -40px);opacity:0.87;
}
.bar8 {
-moz-transform:rotate(315deg) translate(0, -40px);
-webkit-transform:rotate(315deg) translate(0, -40px);opacity:1;
}
#div1, #div2, #div3 {
position:relative;
width:50px;
height:50px;
margin-bottom:1em;
margin-right:1em;
-moz-border-radius:100px;
float:left;
-moz-transform:scale(0.25);
-webkit-transform:scale(0.25);
}
#div1 {float:none}
#div1 div,
#div2 div,
#div3 div {
width:10px;
height:30px;
background:#000;
position:absolute;
top:10px;
left:20px;
}
#div2 {
-webkit-animation-name: rotateThis;
-webkit-animation-duration:2s;
-webkit-animation-iteration-count:infinite;
-webkit-animation-timing-function:linear;
}
@-webkit-keyframes rotateThis {
from {-webkit-transform:scale(0.25) rotate(0deg);}
to {-webkit-transform:scale(0.25) rotate(360deg);}
}
//scale je měřítko velikosti ukazatele
</style>
<div style="-moz-transform: scale(0.25) rotate(45deg);" id="div3" onmouseover="div3.style.visibility='hidden'">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
<div class="bar4"></div>
<div class="bar5"></div>
<div class="bar6"></div>
<div class="bar7"></div>
<div class="bar8"></div>
</div>
<iframe name="ifr2" id="ifr2" src="zdroj.php" width="350px" height="75px" style="" onload="zastavitrotate();">
</iframe>
<script>
var count = 0; function rotate()
{ var elem2 = document.getElementById('div3'); elem2.style.MozTransform = 'scale(0.25)
rotate('+count+'deg)'; elem2.style.WebkitTransform = 'scale(0.25) rotate('+count+'deg)'; if (count==360) { count = 0 }
count+=45; x= window.setTimeout("rotate()", 100); return x; } var x=rotate();
function zastavitrotate()
{ clearTimeout(x);//zastavit skript
div3.style.visibility='hidden'; //zneviditelnit ukazatel
}
</script>
zdroj:
http://kilianvalkhof.com/2010/css-xhtml/css3-loading-spinners-without-images/-------------------------------
Vyhledávání textu html na stránce pomocí javascriptu
včetně zvýraznění textu.
<script language="JavaScript"> <!-- var TRange=null function findString (str) { if (parseInt(navigator.appVersion)<4) return; var strFound; if (window.find) { // CODE FOR BROWSERS THAT SUPPORT window.find strFound=self.find(str); if (!strFound) { strFound=self.find(str,0,1) while (self.find(str,0,1)) continue } } else if (navigator.appName.indexOf("Microsoft")!=-1) { // EXPLORER-SPECIFIC CODE if (TRange!=null) { TRange.collapse(false) strFound=TRange.findText(str) if (strFound) TRange.select() } if (TRange==null || strFound==0) { TRange=self.document.body.createTextRange() strFound=TRange.findText(str) if (strFound) TRange.select() } } else if (navigator.appName=="Opera") { alert ("Opera bohužel není podporována.") return; } if (!strFound) alert ("Další výraz '"+str+"' nebyl nalezen!") return; } //--> </script> <iframe id="srchform2" src="(tammairanslip)'<html><body style=margin:0px; ><form action=(tammairanslip)void(0) onSubmit=if(this.t1.value!=\'\')parent.findString(this.t1.value);return false ><input type=text id=t1 name=t1 value=text size=20><input type=submit name=b1 value=Hledej></form></body></html>'" width=300 height=45 border=0 frameborder=0> </iframe>
//iframe je nutný z toho důvodu, že není asi možné vyhledávat na současné stránce, proto se hledání volá z vnořeného rámu do nadřazeného rámu.
odzkoušeno funkční ff 3.5 (mělo by fungovat i v IE, opera bohužel asi ne, viz. skript)
zdroj:
http://www.javascripter.net/faq/searchin.htm----------------
Výše uvedený skript upravený pro vyhledávání v podřízeném iframu z parent dokumentu.
odzkoušeno funkční ve ff 3.5 (základ jede i v IE)
<script language="JavaScript"> <!-- var TRange=null function findString (str) { if (parseInt(navigator.appVersion)<4) return; var strFound; if (window.ifr.find) { // CODE FOR BROWSERS THAT SUPPORT window.find strFound=ifr.find(str); if (!strFound) { strFound=ifr.find(str,0,1) while (ifr.find(str,0,1)) continue } } else if (navigator.appName.indexOf("Microsoft")!=-1) { // EXPLORER-SPECIFIC CODE if (TRange!=null) { TRange.collapse(false) strFound=TRange.findText(str) if (strFound) TRange.select() } if (TRange==null || strFound==0) { TRange=ifr.document.body.createTextRange() strFound=TRange.findText(str) if (strFound) TRange.select() } } else if (navigator.appName=="Opera") { alert ("Opera bohužel není podporována.") return; } if (!strFound) alert ("Další výraz '"+str+"' nebyl nalezen!") return; } //--> </script>
<form action=(tammairanslip)void(0) onSubmit=if(this.t1.value!='')findString(this.t1.value);return false ><input type=text id=t1 name=t1 value=text size=20><input type=submit name=b1 value=Hledej></form>
//form nevkládat do iframu tak jako v minulém skriptu, hledání totiž probíhá již v podřízeném rámu. -------------------------------------
nahrání souboru z cizího serveru na vlastní pomocí php.
(soubor musí být dostupný běžně přes http, resp. výstup.
<?php if($_GET['soubor']!=''){ $file = $_GET['soubor'];// Open the file to get existing content $current = file_get_contents($file); // Append a new person to the file //$current .= "John Smith\n"; // Write the contents back to the file //echo $current; $file2 = '../example.xml';//relativní adresa file_put_contents($file2, $current); } ?>-------------
javascript - otevření okna, pojmenování okna jako objektu a zaslání metodou POST. Odeslání formu javascriptem s metodou POST včetně skrytých polí.
var form = document.createElement("form"); form.setAttribute("method", "post"); form.setAttribute("action", "test.jsp"); // setting form target to a window named 'formresult' form.setAttribute("target", "formresult"); var hiddenField = document.createElement("input"); hiddenField.setAttribute("name", "id"); hiddenField.setAttribute("value", "bob"); form.appendChild(hiddenField); document.body.appendChild(form); // creating the 'formresult' window with custom features prior to submitting the form var objekt1 = window.open(test.html, 'formresult', 'scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no'); form.submit();Pozn:
-na objekt1 se pak dá odkazovat dále v javascriptu.
-pokud je potřeba okno otevřít do nové záložky, je nutno odstranit parametry scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no z volání window.open. Záleží také na nastavení prohlížeče (viz. nastavení). Někde jsem viděl, že se to nastavovalo i v about :config
Zdroj:
http://stackoverflow.com/questions/178964/javascript-post-on-form-submit-open-a-new-window(na uvedeném zdroji je více možností)
----------------
Zaslání dat metodou Post do iframu:
(možná jde využít i předešlý skript)
Jiná metoda: nutno vytvořit na stránce s iframem formulář:
<form action="http://www.adresaxyz.cz" id="id1" name="form1" method="post" target="iframe"> <input name="jmeno" value="hodnota" type="hidden"> </form>
+
<iframe name="iframe" id="iframe" src="iframe.php" width="100%" height="800px" onload="" ></iframe>
javascriptem lze pak formulář odeslat voláním:
document.getElementById('id1').submit();
nebo
form1.submit();
-----------------------------------
