JavaScript Açılır Kutuları


İçindekiler

    İçindekiler tablosunu göster


JavaScript'in üç tür açılır kutusu vardır: Uyarı kutusu, Onay kutusu ve Bilgi İstemi kutusu.


Uyarı Kutusu

Bilginin kullanıcıya ulaştığından emin olmak istiyorsanız genellikle bir uyarı kutusu kullanılır.

Bir uyarı kutusu açıldığında kullanıcının devam etmek için "Tamam"a tıklaması gerekecektir.

Sözdizimi

window.alert("sometext");

window.alert() yöntemi pencere olmadan yazılabilir önek.

Örnek

Kendiniz Deneyin →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Alert</h2>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
  alert("I am an alert box!");
}
</script>

</body>
</html>

Onay Kutusu

Kullanıcının bir şeyi doğrulamasını veya kabul etmesini istiyorsanız genellikle onay kutusu kullanılır.

Bir onay kutusu açıldığında, kullanıcının devam etmek için "Tamam" veya "İptal"e tıklaması gerekecektir.

Kullanıcı "Tamam"ı tıklarsa kutu true değerini döndürür. Kullanıcı "İptal"i tıklarsa kutu geri döner yanlış.

Sözdizimi

window.confirm("sometext");

window.confirm() yöntemi, pencere öneki olmadan yazılabilir.

Örnek

Kendiniz Deneyin →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Confirm Box</h2>


<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
  var txt;
  if (confirm("Press a button!")) {
    txt = "You pressed OK!";
  } else {
    txt = "You pressed Cancel!";
  }
  document.getElementById("demo").innerHTML = txt;
}
</script>

</body>
</html>


Bilgi İstemi Kutusu

Kullanıcının bir sayfaya girmeden önce bir değer girmesini istiyorsanız genellikle bilgi istemi kutusu kullanılır.

Bir bilgi kutusu açıldığında kullanıcının "Tamam" veya "İptal"e tıklaması gerekecektir. Bir giriş değeri girdikten sonra devam etmek için.

Kullanıcı "Tamam"ı tıklatırsa kutu giriş değerini döndürür. Kullanıcı "İptal"i tıklarsa kutu null değerini döndürür.

Sözdizimi

window.prompt("sometext","defaultText");

window.prompt() yöntemi, pencere öneki olmadan yazılabilir.

Örnek

Kendiniz Deneyin →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Prompt</h2>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
  let text;
  let person = prompt("Please enter your name:", "Harry Potter");
  if (person == null || person == "") {
    text = "User cancelled the prompt.";
  } else {
    text = "Hello " + person + "! How are you today?";
  }
  document.getElementById("demo").innerHTML = text;
}
</script>

</body>
</html>

Satır Sonları

Açılan kutunun içindeki satır sonlarını görüntülemek için ters eğik çizgiyi ve ardından n karakterini kullanın.

Örnek

Kendiniz Deneyin →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>
<p>Line-breaks in a popup box.</p>

<button onclick="alert('Hello\nHow are you?')">Try it</button>

</body>
</html>