JavaScript Nedir?

Kategorilenmemiş, javascript No Responses »

Ara 272011

İlk önce JavaScript’i öğrenmemiz için gerekli ön bilgileri öğrenelim. İlk olarak javascriptin tanımından bahsedelim. JavaScript, web sayfanızın etkileşimli olmasını sağlar. Bu etkileşim, web sayfanızın daha çok insan tarafından beğenilmesini sağlar.

JavaScript dosyaları, web sayfalarında yer alır ve tarayıcılar tarafından çalıştırılıp yorumlanır. Önemli bir hatırlatma yapalım. JavaScript, Javadan farklıdır. Java başka bir programlama dilidir.

Peki JavaScript ile neler yapabiliriz?

Aktif bir kullanıcı arayüzü oluşturabiliriz,
Daha hızlı cevap veren ve kullanışlı bir site oluşturabiliriz,
Özelleştirilmiş html sayfaları oluşturabiliriz.
Tarayıcıdan kontrol edebiliriz.

JavaScript ile neler yapamayız?

Veri tabanıyla bağlantı kurulamaz,
Dosyaya veri yazılamaz,
Sayaç tutamaz,
Var olan durum bilgisini saklayamaz.

Ajax, javascript ile birlikte kullanılır. Ajax, Asynchronous Javascript and XML sözcüklerinin baş harflerinden oluşmuştur. Ajax, etkileşimli uygulamalar geliştirmemizi sağlayan yaklaşımdır. Kısaca Ajax, programlama dili, program veya geliştirme ortamı değildir, bir yaklaşımdır. Web teknolojileri ve standartları ortak kullanımıdır ve etkileşimli web arayüzleri oluşmasına olanak sağlar.

Şimdi JavaScript’in iş akış diyagramını görelim. Örneğin, bir html dosyasını Chrome ile açtıktan sonra, Araçlar sekmesinden “JavaScript konsolunu” seçiyoruz. Karşımıza çıkan ekran ile javascript kodlama, hataları görme gibi işlemler yapabiliriz. Bir javaScript dosyasının uzantısı js’ dir. Tıpkı css dosyaları gibi html kodu içerisinde tanımlanır.

Gül Yurdakul

gulyurdakul.com

Javascript ile Clipboard'a Kopyalama

javascript No Responses »

Ara 122011

js kodumuz

function ClipboardaKopyala(icerik) {

if (window.clipboardData && clipboardData.setData) {

clipboardData.setData(‘text’, icerik);

}

</SCRIPT>

html kodumuz

<a href=”#” id=”copy” onclick=”ClipboardaKopyala(document.getElementById(icerik).innerHTML)”>Clipboard’a Kopyala</a>

deneme kopyalama içeriği

http://www.tahirmutlu.com

</div>

jQuery Resizable Draggable

javascript No Responses »

Kas 172011

jQuery kullanarak elementler üzerinde resizable ve draggable nasıl yapılır ?
Bu makalemizde bu sorunun cevabını vermeye çalışacağız.
Öncelikle uygulamamızın html kodlarının içinde head etiketleri arasına aşağıdaki kodları yazıyoruz.

<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js“></script>

<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js“></script>

<link rel=”stylesheet” type=”text/css” href=”http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css“/>

Aslında yukarıdaki jQuery kodlarını başka bir sunucu üzerinden çekmek çok mantıklı bir yöntem değil. Bu linkten kodları alıp proje dizini içne jQuery dosyası olarak yapıştırılıp kaydedilmesi tavsiye edilir.

Sırada CSS kodlarımızı yazmaya geldi. Css kodlarımızı yine aynı şekilde head etiketleri arasına yazıyoruz.

<STYLE>

.demo {

width:150px;

height:150px;

padding:5px;

background-color:#ff8811;

position:absolute;

top:150px;

left:300px;

}

</STYLE>

Sıradaki işlem yazdığımız jQuery ve Css kodlarını kullanarak elementin gösterileceği div etiketlerini oluşturmaktır. div etiketini sayfada gösterilmesini istediğimiz alana <body> etiketleri içinde yazıyoruz.

<div class=”demo”>Mansur İşçel</div>

Son olarak aşağıdaki Javascript fonksiyonumuzu <body> etiketinin altına yazıyoruz.

<SCRIPT>
	$(function(){
	$(‘.demo’)
	.draggable()
	.resizable();
	});
</SCRIPT>

İşte hepsi bu kadar… Mümkün olduğunca yalın ve açık anlatmaya çalıştım umarım işinize yarar.

Kolay gelsin…
DEMO için tıklayınız…

Mansur İşçel
www.mansuriscel.blogspot.com

window.open() ile açmış olduğunuz pencereden dropdownliste option eklemek

ASP.NET, C#, Kısa Bilgi, javascript No Responses »

Ağu 262011

asp.net uygulamanız içinde ki dropdownlistinize yeni bir eleman (option) eklemek istediğinizde , bunu window.open() ile açacağınız yeni bir pencere ile gerçekleştirmek istiyorsanız , açılan pencerede kaydet butonuna close_form() adında bir javascript fonksiyonu ile eşleştirip bu fonksiyon içierisine aşağıdaki kod blogunu yazarak ana sayfadaki drıpdownlist nesnesine erişerek ekleme işlemini gerçekleştirebilirsiniz.

function close_form()

{

try {

var opt = new window.opener.document.createElement(“option”);

window.opener.document.getElementById(‘dropdownlist_subeler’).options.add(opt);

opt.text = document.getElementById(‘txt_subeler’).value;

opt.value = document.getElementById(‘txt_subeler’).value; window.close();

}

catch(err)

{

alert(err);

}

</script>

Javascrit'e Giriş (Javascript Dersi - 1)

javascript No Responses »

Tem 142011

Javascript internet ortamının en popüler script dilidir ve bilinen bir çok tarayıcıda sorunsuz çalışır örneğin IE,Firefox,Chrome.

Başlamadan Önce Neleri Biliyor Olmak Gerekir?

Javascript öğrenmeye başlamadan önce HTML bilgisine sahip olmak gerekir.

Javascript Nedir?
• İnteraktif HTML sayfaları geliştirmek için oluşturulmuş bir dildir.
• Javascript bir script dildir.
• Javascript genellikle HTML kodları arasına gömülerek çalıştırılır.
• Hiçbir ücret ödemeden herkes tarafından kullanılabilir.
JAVA ve Javascript Aynı mı?

HAYIR!…….
Java ve Javascript tamamyle bir birinden farklı platformlardır. Java Sun Microsystems Tarafından dizayn edilmiş çok güçlü ve çok karmaşık bir High Level Programlama Dilidir.

Gelecek Yazımızda Görüşmek Üzere
Saygılarımla Fettah KURTULUŞ

Javascriptte Basit Hesap Makinesi Örneği

ADO.NET / SQL, javascript 1 Cevap »

Oca 082011

Javascript c ve benzeri dillerdeki fonksiyon işlevini görmektedir.Javacripte yazdığınız işlevleri html kısmında fonksiyon adı ile çağırırsınız,böylece fonksiyondan yapmasını istediğiniz şey uygulanmış olur.Javascript kodları <head> tagi arasına yazılır.Basit bir hesap makinası örneği ile Javascriptin genel mantığı ile ilgili bir fikriniz olabilir:

<html>

<head>

<title>Untitled</title>

function addition()

{

s1=document.getElementById(“textbox1″).value;

//textboxa verilen id değeri yardımıyla oraya yazılan değer alınıyor

s2=document.getElementById(“textbox2″).value;

textboxresult.value=parseInt(s1)+parseInt(s2);

//değerler var tipindedir,onlara işlem yaptırtmak için int çevirmek gerekiyor

}

function subtraction()

{

s1=document.getElementById(“textbox1″).value;

s2=document.getElementById(“textbox2″).value;

textboxresult.value=parseInt(s1)-parseInt(s2);

}

function multip()

{

s1=document.getElementById(“textbox1″).value;

s2=document.getElementById(“textbox2″).value;

textboxresult.value=parseInt(s1)*parseInt(s2);

}

function division()

{

s1=document.getElementById(“textbox1″).value;

s2=document.getElementById(“textbox2″).value;

if(s2==0)

alert(“donomioater cant be ,change the value”)

else

textboxresult.value=parseInt(s1)/parseInt(s2);

}</script>

</head>

<body>

</br>

</br>

</br>

</body>

</html>

javascript ile seçili radio buton değerini almak

Kısa Bilgi, javascript 2 Cevaplar »

Oca 072011

sayfanızda bulunan radio butonlardan seçili olanıın değerini almak için, name değerine göre radio yu bir değişkene atıp seçili olanı bularak değerini alabilirsiniz. ilk olarak radio değerlerimizi oluşturalım.

[html]

<input type=”radio” name=”renkler” id=”renkler” value=”kırmızı”>kırmızı</input><br>

<input type=”radio” name=”renkler” id=”renkler” value=”truncu”>truncu</input><br>

<input type=”radio” name=”renkler” id=”renkler” value=”beyaz”>beyaz</input><br>

<input type=”radio” name=”renkler” id=”renkler” value=”siyah”>siyah</input><br>

daha sonra javascript bölümü ile renkler adındaki radio butonlardan seçili olanları alalım.

[javascript]

function goster()

{

var radio = document.getElementsByName(‘renkler’);

for (i=0; i<radio.length; i++){

if (radio[i].checked == true)

alert(radio[i].value)

}

</script>

her adımda seçili olanın değerini ekrana yazdırmış olduk. bu kodu değiştirerek değer ile istedğiniz işlemi yapabilirsiniz.

Suffusion WordPress theme by Sayontan Sinha