Çevrimdışı

Ders-6: Pencere Açma
Prompts & Opening Windows (soru sorma ve pencere açma)
Ziyaretçilere soru sorma
Deðiþkenleri öðrendiðimiz zamaný hatýrlýyormusunuz? Deðiþkenler bilgileri saklamada kullanýlýyordu. Örnek ve alýþtýrmalarda deðiþkenlerin ’statik’ tariflerini gördünüz, yani browser deðiþkenin deðerini Javascripti çöalýþtýrmadan bildiði durumlar. Halbuki prompt() metodu ile browsere ziyaretçiye soru sormasýný ve cevaplarý deðiþken olarak saklamasýný söyleyebiliriz. Bunun hepsi karmaþýk görünsede esasýnda tek satýrda iþ biter.
var durum = prompt("Kendinizi nasýl hissediyorsunuz?","iyi yada hasta");
Nasýl cevap verdiðiniz önemli deðil, çünkü deðiþkenle ilgili bir þey yapmadým henüz. durum deðiþkeni þu anda Javascript tarafýndan ulaþýlabilir durumda deðil. Eðer sayfa yüklenmeden sizi cevaplamaya mecbur býraksaydým ulaþýlabilir olurdu. Þimdi sayfa yüklendi ve artýk deðiþkenler yerleþtiremezsiniz. Eðer deðiþkene þimdi ulaþmaya çalýþsaydým "object undefined" hatasý alýrdýk. (Evet, deðiþkenler de nesnedir.)
Þimdi kýsaca parantezlerin içindekilerin ne yaptýðýný anlatacaðým. Önceki dersten hatýrlarsýnýz, parantez içinde metodlarýn parametreleri vardýr. Parametreler metodlarýn ne yapmalarý gerektiðini etraflýca anlatýrlar. prompt() metodunun 2 tane parametreye ihtiyacý vardýr. Birincisi soru, ikincisi varsayýlan cevaptýr. Her iki parametrede " " ile sýnýrlanýp virgülle ayrýlýr. Aman dikkat " ve , arasýnda boþluk olmamalýdýr.
Þimdiye kadar çok iyi gidiyoruz,Sorularýn nasýl sorulacaðýný öðrendik. Þimdi ise, bir script ile ziyaretçiye soru sorup, ziyaretçinin cevabýna göre Alert-box içinde selam verelim. Bu þekilde cevaplarý iþleyip geçerli kýlmasýný öðreniriz.
<SCRIPT language="JavaScript">
<!--
var durum = prompt("Kendinizi nasýl hissediyorsunuz?","iyi yada hasta");
if (durum == "iyi") {
alert("Çok güzel, böyle olmaya devam edin")
} else {
alert ("Geçmiþ olsun, hemen bir doktora gidin")
}
// -->
</script>
Kolay deðil mi? if-then-else sanýrým tanýdýk gelmiþtir, deðil mi? Böyle oynamak eðlenceli oluyor mu?
Þimdi bir sonraki bölüme geçelim:
Javascriptle pencere açma
HTML ile pencere açmak rutin bir iþtir, ama bir takým sýnýrlamalarý vardýr. HTML ile pencerelerin neye benzediðini kontrol imkanýnýz yoktur. Hangi özellikler olmalý (scroll bar, status bar, üst menu v.s.) veya pencerenin ölçüleri gibi. Fakat Javascript ile open() metodunu kullanarak bunlarýn hepsini uygulayabilirsiniz. Aynen þöyle:
window.open("URL","isim","özellikler");
Yukardaki kod ile yeni bir pencere açýp, ilk parametre olarak yer belirtirsiniz. Bu örnekte "URL", fakat gerçekte "
Bu forumdaki linkleri ve resimleri görebilmek için en az 25 mesajınız olması gerekir.
diye bir þey yazmanýz lazým.
Metodun ikinci parametresi ise pencerenin adýdýr. Bu sizin ayný pencereye deðiþik sayfalar yüklemenizi saðlar. Örneðin, Javascript kullanarak content.htm dosyasýný yükleyen "content" adýnda yeni bir pencere açalým. Daha sonra ise content2.htm dosyasýný ayný pencereye yüklemeye çalýþalým. Böylece ayný ismi kullanarak yeni bir pencere açmadan, mevcut "content" adýndaki pencerenin içeriðini deðiþtirmiþ olursunuz. Bir örnek verelim:
[Üye Olmadan Linkleri Göremezsiniz. Üye Olmak için TIKLAYIN...]
[Üye Olmadan Linkleri Göremezsiniz. Üye Olmak için TIKLAYIN...]
Anladýnýz mý? Her iki örneðin kodu aþaðýdadýr:
<a href= "#" onClick=’window.open("examples/page1.htm","javascript");’>"javascript" adýnda bir pencere açalým</a><br>
<a href= "#" onClick=’window.open("examples/page2.htm","javascript");’>"javascript"’in içine giren yeni bir HTML sayfasý açalým</a>
Ýlk linki týklayýnca javascript adýndaki pencere açýlýr examples/page1.htm sayfasý içine konulur.
Ýkinci link ise ilk linkin açtýðý pencereye yeni bir HTML sayfasý yerleþtirir. Þimdiye kadar iyi gidiyor. Þimdi birazda features parametresini irdeleyelim!.
Features parametresi açýlan pencerenin hangi özellikleri taþýmasýný istiyorsanýz onlarý dahil eder. Eðer features (özellikler) parametresinde herhangi bir özellik dahil ederseniz, yazýlý olmayanlarý uygulamaz, sadece belirttiðiniz parametreleri olan bir pencere açar. Örneðin:
window.open("URL","name","status,scrollbars,resiza ble")
böyle yazarsanýz, status bar, scrollbar (kaydýrma çubuklarý) ve ölçüleri ayarlanabilir bir pencere elde edersiniz. Dikkat ederseniz, stringde hiç boþluk býrakýlmamýþtýr. Boþluk býrakýrsanýz, bir takým browserlarda hata mesajý alýrsýnýz. Þimdi ise sadece yükseklik ve geniþliði belirten tarif eden bir örnek göreceksiniz:
window.open("URL","name","height=250,width=640")
Unutmayýn boþluk býrakmak yok! Ayrýca HTML’den alýþkýn olduðunuz " " iþaretleri de yok!. Bu biraz karýþýk olabilir, ama bir kere anladýnýz mý tamamdýr.
Aþaðýda kullanabileceðiniz Feature (Özellik) listesi:

height
Pencerenin yüksekliði (pixel olarak)
width
Pencerenin geniþliði (pixel olarak)
status
Sayfanýn altýndaki mesaj çubuðu
menubar
Sayfanýn üstünde Dosya, Düzen Sýk Kullanýlanlar gibi þeylerin olduðu kýsým
scrollbars
Eðer gerekiyorsa kaydýrma çubuklarý görünsün
toolbar
Üstünde Geri, Ýleri, Anasayfa, gibi buttonlarýn olduðu gezinme çubuðu
location
Þu anda bulunduðunuz sayfanýn URLsini gösteren kutu
directories
Bu sadece Netscape için geçerli. "Yenilikler" butonu gibi butonlar...
resizable
Ziyaretçilerin pencere ölçülerini deðiþtirmesine izin veriyorsanýz yazýn
Bunlardan sadece birini yazarsanýz, öbürlerini istemediðiniz anlamýna gelir. Eðer hiç bir þey yazmazsanýz standart bir pencere açýlýr. Hangi özellikleri istiyorsanýz onlarý yazýnca pencere istediðiniz özelliklerde (feature) açýlýr.
Ders-7: ÇerçevelerFrames (Çerçeveler)
Javascriptte frameler pencerelerle eþit iþlem görür. Sanýrým bir pencerenin içeriðinin nasýl deðiþtiðini hatýrlarsýnýz. Hepsi frameler içinde geçerlidir. Basit anlatýmla, her frame ayrý bir pencere olmalýdýr. Eriþim þekli haricinde baþka hiç bir fark yoktur.
Frameler arasý komünikasyon
Buda ayný HTMLde olduðu gibi çalýþýr. Prensip aynýdýr. HTML ile, baþka bir frame’e baðlanmak için target="frameadý" kullanýrsýnýz, javascript ile parent.framename.location.href = ’[Üye Olmadan Linkleri Göremezsiniz. Üye Olmak için TIKLAYIN...]. Gördünüz mü? nekadar kolay. Eðer, benimsayfam adlý frame a link verecek bir javascript isterseniz, þöyle yazacaksýnýz:

<a href= "#" onClick="parent.benimsayfam.location.href = ’
Bu forumdaki linkleri ve resimleri görebilmek için en az 25 mesajınız olması gerekir.
face="Verdana"> Anlaþýldý mý? Þimdi gerçekten frameler arasý komünikasyona baþlayalým. Bir frameden öbürüne bir kaç kelime yazalým. Tetikleyen de bir link olsun. Framesetin kodu þöyle:

<frameset rows="50%,50%">
<frame src= "><frame src= "></frameset>

Þimdi, target.htm yi yapýnýz fakat içi boþ olsun, hatta <HTML> etiketleri bile olmasýn.
Gelelim top.htm ye. Herhangi bir linki tetikleyici olarak kullanýyorum. þöyle:

<a href= "#" onClick="parent.target.document.writeln(’Heeeeyyy! !!’)">Acaba çalýþacak mý?!</a>

Yukardaki satýr uygulanmaya baþladýðý zaman, Javascript target adýndaki frame’e ulaþýr. Daha önceden dediðimiz gibi frame bir pencere gibi düþünüldüðü için, document özelliklerine sahiptir. Nerede document var ise orada writeln() metodu vardýr ve oda frame’in içeriðinin üzerine yazar ve "Heeeeyyy!!!" çýkar.
Kaynak : [Üye Olmadan Linkleri Göremezsiniz. Üye Olmak için TIKLAYIN...]

Umarım işinize yarar ..