জাভাস্ক্রিপ্ট তিনটি গুরুত্বপূর্ণ ধরনের ডায়ালগ বক্স সমর্থন করে। এই ডায়ালগ বক্সগুলিকে উত্থাপন এবং সতর্ক করতে, বা কোনও ইনপুট সম্পর্কে নিশ্চিতকরণ পেতে বা ব্যবহারকারীদের কাছ থেকে এক ধরণের ইনপুট পেতে ব্যবহার করা যেতে পারে। এখানে আমরা একে একে প্রতিটি ডায়ালগ বক্স নিয়ে আলোচনা করব।
নিচে জাভাস্ক্রিপ্ট ডায়ালগ বক্স −
বাস্তবায়নকারী কোড রয়েছেউদাহরণ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.sample {
font-size: 18px;
font-weight: 500;
}
</style>
</head>
<body>
<h1>Dialogue boxes</h1>
<div class="sample"></div>
<button class="alert">ALERT BOX</button>
<button class="confirm">CONFIRM BOX</button>
<button class="prompt">PROMPT BOX</button>
<h3>
Click on the above button to see their dialogue box
</h3>
<script>
let fillEle = document.querySelector(".sample");
document.querySelector('.alert').addEventListener('click',()=>{
alert('Hello World');
});
document.querySelector('.confirm').addEventListener('click',()=>{
confirm('Are you sure?');
});
document.querySelector('.prompt').addEventListener('click',()=>{
prompt('Enter your name');
})
</script>
</body>
</html> আউটপুট
"ALERT BOX" বোতামে ক্লিক করলে -
"কনফার্ম বক্স" বোতামে ক্লিক করলে -
"প্রম্পট বক্স" বোতামে ক্লিক করলে -
