ES6 - İletişim Kutuları
JavaScript, üç önemli iletişim kutusu türünü destekler. Bu iletişim kutuları, herhangi bir girdi hakkında onay almak veya kullanıcılardan bir tür girdi almak için, yükseltmek ve uyarmak için kullanılabilir. Burada her diyalog kutusunu tek tek tartışacağız.
Uyarı İletişim Kutusu
Bir uyarı iletişim kutusu, çoğunlukla kullanıcılara bir uyarı mesajı göndermek için kullanılır. Örneğin, bir giriş alanı bir metin girmeyi gerektiriyor ancak kullanıcı herhangi bir giriş sağlamıyorsa, bu durumda doğrulamanın bir parçası olarak, bir uyarı mesajı göndermek için bir uyarı kutusu kullanabilirsiniz.
Yine de, daha dostça mesajlar için bir uyarı kutusu kullanılabilir. Uyarı kutusu, seçmek ve ilerlemek için yalnızca bir düğme "Tamam" sağlar.
Misal
<html>
<head>
<script type = "text/javascript">
function Warn() {
alert ("This is a warning message!");
document.write ("This is a warning message!");
}
</script>
</head>
<body>
<p>Click the following button to see the result: </p>
<form>
<input type = "button" value = "Click Me" onclick = "Warn();" />
</form>
</body>
</html>Yukarıdaki kod başarılı bir şekilde yürütüldüğünde aşağıdaki çıktı görüntülenir.
Onay İletişim Kutusu
Bir onay iletişim kutusu çoğunlukla herhangi bir seçenek için kullanıcının onayını almak için kullanılır. İki düğmeli bir iletişim kutusu görüntüler: Tamam ve İptal.
Kullanıcı Tamam düğmesine tıklarsa, pencere yöntemi confirm()true dönecek. Kullanıcı İptal düğmesini tıklarsa, onaylama () yanlış döndürür. Aşağıdaki gibi bir onay iletişim kutusu kullanabilirsiniz.
Misal
<html>
<head>
<script type = "text/javascript">
function getConfirmation(){
var retVal = confirm("Do you want to continue ?");
if( retVal == true ){
document.write ("User wants to continue!");
return true;
} else {
Document.write ("User does not want to continue!");
return false;
}
}
</script>
</head>
<body>
<p>Click the following button to see the result: </p>
<form>
<input type = "button" value = "Click Me" onclick = "getConfirmation();" />
</form>
</body>
</html>Yukarıdaki kod başarılı bir şekilde yürütüldüğünde aşağıdaki çıktı görüntülenir.
Bilgi İstemi İletişim Kutusu
Bilgi istemi iletişim kutusu, bir kullanıcı girişi almak için bir metin kutusu açmak istediğinizde çok kullanışlıdır. Böylelikle kullanıcı ile etkileşime geçmenizi sağlar. Kullanıcının alanı doldurması ve ardından Tamam'ı tıklaması gerekir.
Bu iletişim kutusu, adı verilen bir yöntem kullanılarak görüntülenir. prompt() bu iki parametre alır: (i) metin kutusunda görüntülemek istediğiniz bir etiket ve (ii) metin kutusunda görüntülenecek varsayılan bir dize.
Bu iletişim kutusunda iki düğme bulunur: Tamam ve İptal. Kullanıcı Tamam düğmesini tıklarsa, pencere yöntemi istemi () metin kutusundan girilen değeri döndürür. Kullanıcı İptal düğmesini tıklarsa, pencere yöntemi istemi () null değerini döndürür.
Misal
<html>
<head>
<script type = "text/javascript">
function getValue(){
var retVal = prompt("Enter your name : ", "your name here");
document.write("You have entered : " + retVal);
}
</script>
</head>
<body>
<p>Click the following button to see the result: </p>
<form>
<input type = "button" value = "Click Me" onclick = "getValue();" />
</form>
</body>
</html>Yukarıdaki kod başarılı bir şekilde yürütüldüğünde aşağıdaki çıktı görüntülenir.
