Clipboard API

Clipboard API

by ayyanarj

HTML

<html>
<head>

</head>
<body>
<div id="text">
</div>

<input type="button" id="btn" name="btn" text="write"  onclick="writetextAsync()" value="write"/>

<input type="button" id="btn" name="btn" text="read"  onclick="readAsync()" value="read"/>
</body>
</html>

JavaScript

function logValue(val) {
 document.getElementById('text').innerText = document.getElementById('text').innerText + "\n" + val;
}

if (navigator.clipboard) {
	//logValue('Clipboard supported');
} else {
	//logValue('Clipboard not supported');
}

function writetext() {
navigator.clipboard.writeText('I am writing to clipboard')
  .then(() => {
    console.log('Woohoo');
  })
  .catch(err => {    
    console.error('Oh no: ', err);
  });
}

function read() {

navigator.clipboard.readText()
 .then(text => {
        logValue(text);
 })
 .catch(err => {
 			logValue(err);
 });

}


async function writetextAsync() {
  try {
    await navigator.clipboard.writeText('I am writing to clipboard in async');
    console.log('Woohoo');  
  } catch (err) {
    console.error('Oh no: ', err);
  }
}

async function readAsync() {
const val2 = await navigator.clipboard.readText();
console.log('Woohoo -- ', val2);  
logValue(val2);
}