val metodu
val metodu, bir elemanın mevcut değerini almanıza
ve değiştirmenize olanak tanır.
Sözdizimi
Bir kümedeki ilk elemanın mevcut değerini şu şekilde alabiliriz:
$(seçici).val();
val metodu temel olarak form elemanlarının değerlerini
almak için kullanılır, örneğin:
input,
select
ve textarea.
Eğer boş bir koleksiyon üzerinde çağrılırsa, undefined döndürür.
multiple özniteliği ayarlanmış bir select ile çalışırken,
metot seçilen her bir option'ın değerlerinden oluşan bir dizi döndürür.
Hiçbiri seçili değilse, boş bir dizi döndürülür.
Bir kümedeki her elemanın değerini şu şekilde ayarlayabiliriz.
Parametre olarak bir dize, dizi veya sayı iletilebilir:
$(seçici).val(değer);
Bir işlevi kümedeki her elemana uygulama. İşlev ilk parametre olarak kümedeki mevcut indeksi, ikinci parametre olarak da mevcut değeri alır:
$(seçici).val(öznitelik adı, function(kümedeki indeks, mevcut değer));
Örnek
Aşağıdaki örnekte, input alanına girilen değerleri alıp aşağıdaki paragrafa yazdıralım:
<input type="text" value="metin">
<p></p>
p {
color: green;
margin: 8px;
}
$('input').keyup(function() {
let value = $(this).val();
$('p').text(value);
}).keyup();
Örnek
Şimdi ise val metodu yardımıyla
bastığımız butonların yazılarını, aşağıda bulunan
input alanına yazdıralım:
<div>
<button>bir</button>
<button>iki</button>
<button>üç</button>
<button>dört</button>
</div>
<input type="text" value="butonlara tıklayın">
button {
margin: 4px;
cursor: pointer;
}
input {
margin: 4px;
color: green;
}
$('button').click(function() {
let text = $(this).text();
$('input').val(text);
});
