কম্পিউটার টিউটোরিয়াল

জাভাস্ক্রিপ্টে 'কপি টু ক্লিপবোর্ড' ফিচার তৈরি করা

কপি টু ক্লিপবোর্ড ফিচার

select() এবং `document.execCommand("copy")` ব্যবহার করে টেক্সট ক্লিপবোর্ডে কপি করা যায়। মডার্ন ব্রাউজারে `navigator.clipboard.writeText()` ব্যবহার করা ভালো।

উদাহরণ

<!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-size: 18px; font-weight: 500; color: rebeccapurple; }
        input, button { padding: 8px; }
    </style>
</head>
<body>
    <h1>কপি টু ক্লিপবোর্ড তৈরি করা</h1>
    <input class="textCopy" type="text" />
    <button class="Btn">Copy Text</button><br /><br />
    <input type="text" placeholder="paste here" />
    <h3>উপরোক্ত বাটনে ক্লিক করুন টেক্সটবক্স থেকে টেক্সট কপি করতে</h3>
    <script>
        let BtnEle = document.querySelector(".Btn");
        let textCopyEle = document.querySelector(".textCopy");
        BtnEle.addEventListener("click", () => {
            textCopyEle.select();
            document.execCommand("copy");
        });
    </script>
</body>
</html>

আউটপুট

প্রথম বক্সে টেক্সট লিখে "Copy Text" বাটনে ক্লিক করলে টেক্সট ক্লিপবোর্ডে কপি হবে। دومের বক্সে পেস্ট করলে টেক্সটটি পাওয়া যাবে।

  1. জাভাস্ক্রিপ্টে পেজ লোড হওয়ার সাথে সাথে টেক্সট হাইলাইট করার পদ্ধতি

  2. জাভাস্ক্রিপ্টে এলিমেন্ট ট্যাগের বাইরের টেক্সট ওয়েব পেজ থেকে সরানো

  3. জাভাস্ক্রিপ্টে অ্যারের সব মান ওয়েব পেজের p ট্যাগে দেখানো

  4. জাভাস্ক্রিপ্ট দিয়ে ওয়েব পেজের ভিডিও ট্যাগ লুকানোর পদ্ধতি