জাভাস্ক্রিপ্টে টেক্সট এরিয়ায় অ্যারো কি ডিজেবল করা

টেক্সট এরিয়ায় অ্যারো কি বন্ধ করা

keydown ইভেন্টে event.preventDefault() ব্যবহার করে নির্দিষ্ট কি (অ্যারো কি, স্পেস ইত্যাদি) ডিজেবল করা যায়।

উদাহরণ

<!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; }
        .result { font-weight: 500; font-size: 18px; color: blueviolet; }
    </style>
</head>
<body>
    <h1>টেক্সট এরিয়ায় অ্যারো কি ডিজেবল করা</h1>
    <textarea class="AreaText"> Hello world this is some sample text inside the text area element </textarea>
    <div class="result"></div>
    <button class="Btn" style="margin: 15px;">অ্যারো বন্ধ করুন</button>
    <h3>উপরোক্ত বাটনে ক্লিক করুন টেক্সট এরিয়ায় অ্যারো স্ক্রলিং বন্ধ করতে</h3>
    <script>
        let BtnEle = document.querySelector(".Btn");
        let resEle = document.querySelector(".result");
        BtnEle.addEventListener("click", () => {
            window.addEventListener("keydown", (event) => {
                if ([32, 37, 38, 39, 40].indexOf(event.keyCode) > -1) {
                    event.preventDefault();
                }
            }, false);
            resEle.innerHTML = "অ্যারো কি ব্যবহার করে স্ক্রলিং বন্ধ করা হয়েছে";
        });
    </script>
</body>
</html>

আউটপুট

বাটনে ক্লিক করার পর টেক্সট এরিয়ায় অ্যারো কি দিয়ে স্ক্রোল করা যাবে না।