کپی در کلیپ برد با استفاده از جاوا اسکریپت

سلام دوستای عزیز امیدوارم حالتون خوب باشه

شاید این پست خیلی ساده باشه شایدم نمیدونم … ! ولی خب بهتره بعضی وقت ها برای یه کپی ساده اصلا نیاز نباشه که بخواهیم دنبال یه فریم ورک بگردیم و باهاش کار کنیم باهمین چند خط کد هم کارمون راه میوفته .

اما هدف تو این پست اینه که شما حتما تا الان نمیدونستین که چیجوری با استفاده از جاوا اسکریپت یک دکمه ی کپی ایجاد کنید پس با من همراه باشید، خب دیگه من یکم پر حرفی کردم شما به بزرگی خودتون ببخشید حالا بریم سره ادامه بحثمون

 

تنها کافیه کد زیر را کپی کنید و اجرا بگیرید !!!! wooOOW

<input id="input" type="text"/>
<button id="copy">Copy</button>

کد بالا یک تکست باکس با آی دی input و یک دکمه با آی دی copy ایجاد میکند

function copy() {
  var copyText = document.querySelector("#input");
  copyText.select();
  document.execCommand("Copy");
}

document.querySelector("#copy").addEventListener("click", copy);

خب حالا در داخل بلاک در خط اول با استفاده از متد querySelector ما یک المنت با آی دی input انتخاب میکنیم و در متغییر copyText قرار میدهیم
در خط دوم با استفاده از متد select مقادیر المنت input خود را انتخاب میکنیم.

و در خط سوم با استفاده از متد execCommand و مشخص کردن فرمان copy اعلام میکنیم که اون مقداری رو که انتخاب کردیم رو کپی کن

حالا ما یک متد داریم به اسم copy و کافیه فقط برای این متد  یک رویدادی تعریف کنیم که با اتفاق افتادن یا  (trigger ) شدن رویداد متد copy فراخوانی شود که حالا ما در خط آخر با استفاده از متد querySelector دکمه ی کپی را انتخاب کردیم و رویداد کلیک براش تعریف کردیم که وقتی روی دکمه کپی کلیک شد متد copy اجرا شود

 

شما همچنین با استفاده از متد execCommand میتوانید دستور های مختلف دیگیری هم داشته باشید مثلا copy یکی از این دستورات بود ، دستورهای دیگر اعم از cut , past هم میتوانید اعمال کنید مانند مثال زیر

document.execCommand("copy")
document.execCommand("cut")
document.execCommand("paste")

امیدوارم که بهتون کمک کرده باشم برای دلگرم کردن من هم شده کامنت بزارید متشکرم 🙂

  البته اگر مایل بودید میتوانید من را در پی پینگ حمایت کنید

مهدی نیکخو

حوزه ی تخصصی ام برنامه نویسی با تکنولوژی های مایکروسافت هستش اما بقیه تکنولوژی های دیگه رو هم دوست میدارم :) من به این اعتقاد دارم که اگه "هرچیزی که یادگرفتم و یاد بدم ، بیشتر یاد میگیرم" برای همین نیکخو آی آر را ساختم تا بنویسم و دوستانی که مثل من زمانی اون مشکل من رو داشتند سریع مشکلشون حل بشه

نظر شما چیست؟