Bu sayfadaki yazılar
Sayfanın metni
Sayfa 86
header('location:blabla'); exit; ?> yerine
<?php ... ... ... ?> <html> .... .... <meta http-equiv="Refresh" content="0; url=blabla"> .... .... </html> şeklinde kullanarak bu sorunun üstesinden gelebilirsiniz.
JAVASCRIPT
1) Elimde bir sayfa var ama kodlarına erişimim yok ya da değiştirmek istemiyorum. O sayfanın HTML yapısını başka türlü kontrol altına alabilir miyim?
Erişiminiz olan sunucularınızda çalışan sayfaların kodları elinizde olmasa bile (örnek: Zend Guard ile encode edilmiş bir proje, compile edilmiş CGI çıktıları v.b.) onlar üzerinde JavaScript kullanarak hakimiyet kurabilirsiniz. Bunun için sayfayı frame içerisine almak gerekiyor. Örnek:
Normalde index.php ile açılan bir sayfamız olduğunu varsayalım. Bu durumda biz aşağıdaki index_alt.htm'i oluşturarak sayfanın görünümünü değiştirmeden araya gizli bir frame içerisinde "gizli.htm"i sokmuş oluyoruz.
index_alt.htm
<html> ... <frameset rows="*,0"> <frame name="anasayfa" src="index.php"></frame> <frame name="gizli" src="gizli.htm"></frame> </frameset> ... </html>
Buradaki rows="*,0" ile index.php'yi tüm alanı, yani browser'ın tamamını kaplayacak şekilde, gizli.htm'i 0 yüksekliğinde yani aşağıda görünmeyecek şekilde tanımlıyoruz. Buradaki sıralama önemli. gizli.htm'i önce tanımlayacak olursan index.php henüz yüklenmeden gizli.htm çalışmış olur ve index.php'nin içinde yüklenen çeşitli bölümlere erişemeyebilir. index.php'nin yüklenmesini garantilemek istiyorsak en geçerli yol gizli.htm'e bir sayaç ekleyerek kodun belirli bir zaman geçtikten sonra çalışmasını sağlamaktır.
function yap() { .... } setTimeout("yap()", 1000); // 1 sn sonra gibi.
Klavyeyle gezinmek için ← ve → tuşları.
Sayfa 87
Peki gizli.htm tam olarak ne yapmamıza yarıyor? Bu tamamen sizin arzunuza bağlı. Size yapılabileceklerden birini aşağıdaki örnekte veriyorum. Bu örnek yardımıyla index.php'de yüklenen ilk resmin üzerinde sağ click'e basıldığında çıkan menüyü iptal ediyoruz.
gizli.htm
<html> ... <script> parent.window.frames["anasayfa"].document.images[0].oncontextmenu = function(){ return false; }; </script> ... </html>
Peki tam olarak ne yaptık burada?
parent ile bir üst obje seviyesine çıktık, yani index_alt.htm'de tanımladığımız frame'lerin her ikisinin de bulunduğu seviyeye. Daha sonra window.frames["anasayfa"] diyerek "anasayfa" yani "index.php"nin yer aldığı bölüme ulaştık. document.images bu sayfada yer alan tüm resimlerin bulunduğu dizi. document.images[0] ile ilk resmi seçtik. Son olarak "oncontextmenu" ile sağ mouse click event'ini kendi yarattığımız bir fonksiyona yönlendirdik. Bu fonksiyon ise "return false" komutuyla event'i gerçekleşmeden durdurmaya yarıyor. return false yerine alert('deneme') yazarak da script'i test edebilirsiniz.
Tabii ki bu en basit kullanım örneklerinden biri. Bu yöntemle sayfa içerisindeki hemen her şeyi kontrol etmeniz, elementler eklemeniz, değiştirmeniz hatta yok etmeniz mümkün. Ancak unutmayın ki bu kullanım lokal sayfalar için geçerlidir. Yani web server elinizin altında değilse ve index_alt.htm, gizli.htm dosyalarını index.php'nin olduğu server'a koyamıyorsanız, bu durumda bu yöntem işe yaramayabilir.
2) Dinamik olarak nasıl element yaratabilirim? Bunlara nasıl event ekleyebilirim?
Javascript'te az önce gördüğümüz örnekteki event tanımlama kullanımı her zaman işe yarıyor mu? Aslında çoğunlukla yarar. Ancak bir de dinamik olarak yaratılan elementler var ki bu durumda işler biraz değişebiliyor. Size aşağıdaki kullanımı tavsiye ediyorum.
<html> ... <body> <div id="tasiyici"></div> <script> function goster(yazi) { alert("Textbox'a girmiş olduğunuz yazı: "+yazi+"\nİşte dinamik elementlerin gücü!"); } var textbox = document.createElement('input'); textbox.setAttribute('type','text'); textbox.setAttribute('size','50');
var button = document.createElement('input'); button.setAttribute('type','button'); button.value = 'Onayla'; if(document.addEventListener) // Firefox button.addEventListener('click',function(){ goster(textbox.value); },false); else if(document.attachEvent) // Internet Explorer button.attachEvent('onclick',function(){ goster(textbox.value); });