Bir text alana girilen metnin kaç kelimeden olustugunu JavaScript ile nasil bulabiliriz. JavaScript kullanmamizin avantaji, kullanici metni yazarken ayni anda kelime sayisini bularak ekranda gösterebiliriz.
Ilk olarak kelimeleri neye göre ayiracagiz. Türkçede kelimeler birbirinden boslukla ayrilir. Noktalama isaretleri kullanildiktan sonra bir bosluk birakilir. Birinci yöntemde kullanicilarimizin bu kurala uydugunu farz edelim.
Sayfamizda head taglari arasina asagidaki JavaScript kodlarini yazalim
<script language="javascript" type="text/javascript">
function KelimeSayisiBul() {
var a = document.getElementById('Metin1').value;
var kelimeler = new Array();
kelimeler = a.split(' ');
var cnt = kelimeler.length;
document.getElementById('kelimeSayisiLabel').innerHTML = cnt;
}
</script>
|
Sayfamizda body taglari arasina da asagidaki gibi bir text alan ve label eklersek, text alanin keyup olayinda da yukarida tanimladigimiz KelimeSayisiBul fonksiyonunu çagirirsak text alana yazdigimiz cümlenin kaç adet kelimeden olustugunu aninda labelda görebiliriz.
<table>
<tr>
<td>
<input id="Metin1" onkeyup="KelimeSayisiBul();" type="text"/>
</td>
<td>
Kelime Sayisi:
<label id="kelimeSayisiLabel">0</label>
</td>
</tr>
</table>
|
Peki, yukaridaki örnekte eksikler nelerdir.
Ilk olarak noktalama isaretlerinden sonra bosluk birakilmadiginda ve kelimeler arasinda birden fazla bosluk birakildiginda yukaridaki yapi hatali çalisir. Ilk olarak noktalama isaretlerini bularak bunlari bosluga çevirelim sonrasinda cümlemizi yukaridaki örnekte oldugu gibi bosluklara göre ayiralim edelim. Eger kelimeler arasinda birden fazla bosluk birakildi ise bosluga göre ayirma yaptigimizda olusan dizinin bazi elemanlarinin bos oldugunu görürüz. Öyleyse bu kontrolü de yaparsak cümlemizin tam olarak kaç kelimden olustugunu görebiliriz.
Yukaridaki ifadelere göre JavaScript kodumuzu asagidaki gibi degistirmemiz yetecektir.
<script language="javascript" type="text/javascript">
function KelimeSayisiBul2() {
var a = document.getElementById('Metin2').value;
a = a.replace(/[,.?!;:]/gi, ' ');
document.getElementById('kelimeSayisiLabel2').innerHTML = a;
var kelimeler = new Array();
kelimeler = a.split(' ');
var l = 0;
var cnt = 0;
while (l < kelimeler.length) {
if (kelimeler[l] != '')
cnt++;
l++;
}
document.getElementById('kelimeSayisiLabel2').innerHTML = cnt;
}
</script>
|
Yukarida bahsettigimiz iki yöntemi de barindiran html ve JavaScript kodlari :
<html >
<head>
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
function KelimeSayisiBul() {
var a = document.getElementById('Metin1').value;
var kelimeler = new Array();
kelimeler = a.split(' ');
var cnt = kelimeler.length;
document.getElementById('kelimeSayisiLabel').innerHTML = cnt;
}
</script>
<script language="javascript" type="text/javascript">
function KelimeSayisiBul2() {
var a = document.getElementById('Metin2').value;
a = a.replace(/[,.?!;:]/gi, ' ');
document.getElementById('kelimeSayisiLabel2').innerHTML = a;
var kelimeler = new Array();
kelimeler = a.split(' ');
var l = 0;
var cnt = 0;
while (l < kelimeler.length) {
if (kelimeler[l] != '')
cnt++;
l++;
}
document.getElementById('kelimeSayisiLabel2').innerHTML = cnt;
}
</script>
</head>
<body>
<table>
<tr>
<td colspan="2">
Sadece Bosluga göre kelime sayimi:
</td>
</tr>
<tr>
<td>
<input id="Metin1" onkeyup="KelimeSayisiBul();"type="text" />
</td>
<td>
Kelime Sayisi:
<label id="kelimeSayisiLabel">
0</label>
</td>
</tr>
<tr>
<td colspan="2">
<hr style="color: Red"></hr>
</td>
</tr>
<tr>
<td colspan="2">
Bosluk ve Noktalama isaretlerine göre kelime sayimi(Birden fazla bosluk kontrolü
yapar)
</td>
</tr>
<tr>
<td>
<input id="Metin2" onkeyup="KelimeSayisiBul2();"type="text" />
</td>
<td>
Kelime Sayisi:
<label id="kelimeSayisiLabel2">
0</label>
</td>
</tr>
</table>
</body>
</html>
|
Yukaridaki örnegi buradan deneyebilirsiniz.
Yorumlar
Yorum Gönder