รับเนื้อหาคลิปบอร์ดปัจจุบันไหม [ปิด]

ฉันต้องการทราบวิธีที่จะทำให้สคริปต์ของฉันตรวจพบเนื้อหาของคลิปบอร์ดและวางลงในช่องข้อความเมื่อเปิดเพจโดยไม่มีการป้อนข้อมูลจากผู้ใช้ ทำได้ยังไง?

window.clipboardData.getData('Text')จะทำงานในบางเบราว์เซอร์ อย่างไรก็ตามเบราว์เซอร์จำนวนมากที่ใช้งานได้จะแจ้งให้ผู้ใช้ทราบว่าต้องการให้หน้าเว็บเข้าถึงคลิปบอร์ดได้หรือไม่

ใช้API คลิปบอร์ดใหม่ผ่านnavigator.clipboard. สามารถใช้งานได้ดังนี้:

navigator.clipboard.readText()
  .then(text => {
    console.log('Pasted content: ', text);
  })
  .catch(err => {
    console.error('Failed to read clipboard contents: ', err);
  });

หรือด้วยไวยากรณ์ async:

const text = await navigator.clipboard.readText();

โปรดทราบว่าสิ่งนี้จะแจ้งให้ผู้ใช้ทราบด้วยกล่องโต้ตอบการขออนุญาตดังนั้นจึงไม่มีธุรกิจที่น่าตลก

โค้ดด้านบนจะไม่ทำงานหากถูกเรียกจากคอนโซล ใช้งานได้เฉพาะเมื่อคุณเรียกใช้โค้ดในแท็บที่ใช้งานอยู่ ในการเรียกใช้รหัสจากคอนโซลของคุณคุณสามารถกำหนดระยะหมดเวลาและคลิกในหน้าต่างเว็บไซต์ได้อย่างรวดเร็ว:

setTimeout(async () => {
  const text = await navigator.clipboard.readText();
  console.log(text);
}, 2000);

อ่านเพิ่มเติมเกี่ยวกับการใช้งาน API และในเอกสารพัฒนาซอฟต์แวร์ของ Google

ข้อมูลจำเพาะ

คุณสามารถใช้ได้

window.clipboardData.getData('Text')

เพื่อรับเนื้อหาของคลิปบอร์ดของผู้ใช้ใน IE อย่างไรก็ตามในเบราว์เซอร์อื่นคุณอาจต้องใช้แฟลชเพื่อรับเนื้อหาเนื่องจากไม่มีอินเทอร์เฟซมาตรฐานในการเข้าถึงคลิปบอร์ด คุณอาจลองใช้ปลั๊กอินZero Clipboard นี้ก็ได้

ต่อไปนี้จะให้เนื้อหาที่เลือกและอัปเดตคลิปบอร์ด

ผูกรหัสองค์ประกอบกับเหตุการณ์การคัดลอกแล้วรับข้อความที่เลือก คุณสามารถแทนที่หรือแก้ไขข้อความ รับคลิปบอร์ดและตั้งค่าข้อความใหม่ เพื่อให้ได้รูปแบบที่แน่นอนคุณต้องตั้งค่าประเภทเป็น "text / hmtl" คุณสามารถผูกเข้ากับเอกสารแทนองค์ประกอบได้

document.querySelector('element').bind('copy', function(event) {
  var selectedText = window.getSelection().toString(); 
  selectedText = selectedText.replace(/\u200B/g, "");

  clipboardData = event.clipboardData || window.clipboardData || event.originalEvent.clipboardData;
  clipboardData.setData('text/html', selectedText);

  event.preventDefault();
});