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

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

الخطوة الأولى - إضافة 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;
}

تجربة شخصية