كيفية نسخ النص إلى لوحة المفاتيح

تعلم كيفية نسخ النص إلى لوحة المفاتيح باستخدام JavaScript.

انقر على هذا الزر لنسخ النص من حقل النص.

أكتب النص في لوحة المفاتيح

الخطوة الأولى - إضافة HTML:

<!-- نص الحقل -->
<input type="text" value="Hello World" id="myInput">
<!-- زر لنسخ النص -->
<button onclick="myFunction()">نسخ النص</button>

الخطوة الثانية - إضافة JavaScript:

function myFunction() {
  // الحصول على حقل النص
  var copyText = document.getElementById("myInput");
  // اختيار حقل النص
  copyText.select();
  copyText.setSelectionRange(0, 99999); // للهواتف المحمولة
   // نسخ النص في حقل النص
  navigator.clipboard.writeText(copyText.value);
  // تنبيه النص المقلد
  alert("مقلد النص: " + copyText.value);
}

تجربة شخصية

اعرض النص المقلد في الإشارة النصية

إضافة CSS:

.tooltip {
  الموقع: نسبي;
  عرض: داخلية;
}
.tooltip .tooltiptext {
  مرئية: غير مرئي;
  العرض: 140px;
  لون-الخلفية: #555;
  لون-النص: #fff;
  منسق-النص: مركز;
  دائرة-الحدود: 6px;
  الحشوة: 5px;
  الموقع: مطلق;
  الفئة-الزمنية: 1;
  الأسفل: 150%;
  اليسار: 50%;
  margين-اليسار: -75px;
  شفافية: 0;
  过渡: شفافية 0.3s;
}
.tooltip .tooltiptext::after {
  المحتوى: "";
  الموقع: مطلق;
  الاعلى: 100%;
  اليسار: 50%;
  margين-اليسار: -5px;
  عرض-الحدود: 5px;
  نمط-الحدود: solid;
  اللون-الحدود: #555 شفاف شفاف شفاف;
}
.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

تجربة شخصية